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FPS Animation in Maya 





FPS Animation Overview 


First-person shooter (FPS) animations are utilized in 
games where player immersion is signif cant. It is as if 

the player were stepping into the character's shoes and 
becoming that character. The player will usually only see 
their character's hands and weapon if the gameplay calls 
for one. Since we only see a fraction of the character, 
creating FPS animations is usually simpler than animating 
characters we will see in full view, such as non-player 
characters. In the animation phase, our job isto create 
believable character movement. There are a few technical 
considerations to think about before starting the FPS 


n Greeting Genes wth Urad Engine Suostane Parts; &i Vaya 


436 





animations, but once those are set up, breathing life into 
our character should be straightforward. Before moving 
on, if you feel like speeding up the workf ow, you can 
jump to the next chapter where the second half shows 
how to use motion captured data as our animation 
instead of doing it manually. 


Referencing the Character Rig 


Instead of opening Hlen rig as usual, you havethe 

option of referencing the character rig in a new Mayaf le. 
Referencing in the rig will allow you to animate an instance 
of the character while leaving the original f le untouched. 


Step 1: Start with a clean Maya f le, and go to 
File>Create Reference. Navigateto Hlen rig 
and click on Referenceto bring in theinstanced 
version of theHlen rig. Thisisthef leyou will 
begin your animationsin. 


Why? 


When you start animating and maybe realize that you 
need to make model or rigging adjustments, you can 
jump into the original rig f le, Ellen. rig, and make those 
changes. When you return to your animation f le with the 
referenced rig, those adjustments will be ref ected on 

the model and/or rig, and your animation should still be 
intact. If you do not see those changes immediately, go 

to File>Reference Editor, right click on the rig name in the 
newly appeared window, and choose Reload Reference to 
bring in those changes into your animation f le. 


Besides the ease of updating the model and rig separately 
fromthe animation data, referencing makes it such that 
altering the rig while you are animating is impossible. You 
will not be ableto delete any controls or any parts of the 
model by accident. 


Tips and Tricks 


Referencing character rigs is optional and not required to 
animate. You can always just animate straight on the original 





rig f le. Be sure to incrementally save your f les regardless 
of which method you decide to go with. For example, let 
us say you have been working in a Maya scene named 
AnimationFile 1 After an allotted time, such as 10 minutes, 
| would recommend creating a new iteration named 
AnimationFile 2. Sometimes animation f les can crash, so 
if AnimationFile 2 becomes corrupted in an unexpected 
crash, you will still have AnimationFile 1as a backup. 


Save Files 


All the animations for each weapon set will be housed in 
their own Mayaf le. When you save this Mayaf le, name it 
Hlen gun animationsto distinguish it from other f les. 


Display Layers 


Seeing your character without any obstructions is 
important while you animate. Display layers can be used 
to hide certain aspects of the model or rig when they are 
not needed, while also removing the need to dig through 
the Outliner every single time you want to hide those 
character parts. 


Step 2: Shift-select all the parts of thegeometry 
that wedo not need to seefor FPS animation 
creation. Navigateto the Display Layer Editor 
in thelower right-hand sideof the screen, and 
go to Layers>Create Layer from Selected. A new 
display layer named layer1 will appear right 
below the area you just clicked. Let's renamethe 
new layer to something more specif c by double 
clicking on thenamelayer1 In the Edit Layer 
window, type RestOf BodyMesh in the Name 
input box and click on Saveto exit the window. 

Thecolumns of boxesto the right of the 
display layer name will allow usto quickly 
control thedisplay layers. Thef rst column 
containing the letter "V" controlsthe visibility 
of theobject. To tum of the RestOfBodyMesh 
display layer, dickonthe letter "V" so that the 
box becomes empty. EHlen's upper body and 
arms should betheonly visible parts of the 
geometry in your viewport. 
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Step 3: Repeat this process with the controlsthat are 
not needed for FPS animations and namethe 
layer NotNeededControls. 

Step 4: Let's also createa display layer for the 
visible partsof Elen's mesh and instead utilize 
a dif erent feature of display layers. When you 
click on the blank third column box, theletter “R”, 
meaning referenced, will eventually be revealed. 
Tuming on the letter "R" will causethe geometry 
to not be selectable. 





Why? 


During the animation process, you will want to only move 
the controls created during the rigging process, not the 
character geometry. By putting Ellen's upper body, arms, 
and weapon geometry on their own display layers with 
the referenced option active, you will not have to worry 
about setting stray keyframes beyond the controls. 
Figure 11.1 shows an example of the various display layers 
created so far. 


Tips and Tricks 


As you animate, you will need to quickly preview your 
animation without the controls, which is how we will 
ultimately see the character in the game. In the Viewport 
menu bar, click on Show, which will bring up along list 
of components that you can hide and unhide, as seen in 
Figure 11.2. Click on NURBS Curves or use the keyboard 
shortcut Alt 4-1. 


A NotNeededControls 


"A RestofBodyMesh 


V4 
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This will cause both the checkmark next to NURBs Curves 
and all the controls in the sceneto disappear temporarily, 
which is like tuming of the visibility of a display layer. | 
recommend using the display layer visibility toggle if you 
want to hide a part of the character for a long period of 
time. Use the Show>NURBS Curves hotkey shortcut while 
you are in the middle of animating to do quick checks on 
moverent clarity. 





Camera Conf guration 


Step 5: Select the Front/Persp quick layout button, 
located right abovethe Outliner button, to 
bring up two viewports on your screen. We will 
create a dedicated FPS camera in the left-hand 
viewport by going to Panels-Perspecti ve-New. 
Nameit FPS Cam. In that same viewport, tum 
ontheresolution gate by dicking on theicon 
seen in Figure 11.3. Also dick on thegate mask 
icon, which isto theright of the resolution gate 
icon, so that a light grey, shaded area will appear 

AQF 113 Raxduiagdeiam around the gate. 

Step 6: Ontheright-hand-side viewport, we will 
moveFPS Camsothat it mimicsthe player 
character'slineof sight. If you do not seea 
f oating green camera, check if camera visibility 
is on by going to Show>Cameras in theViewport 
menu bar. Grab FP5. Camand moveit so that is 
near Hlen's eyes (Figure 11.4). You may tum on 
thevisibility of the RestofBodyMesh display layer 
temporarily so you can position the camera with 
Hlen's head geometry on. 





Why? 


This viewport setup will allow you to see the FPS camera 
view and your working area at the same time. Since the 
resolution gate and gate masks are visible on the left- 
hand side, you will be ableto focus on what the player 
will see in the game. Grabbing controls will be easier in 
the right-hand-side viewport since you can move freely 
around the scene. 
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Step 7: Now that wehave a dedicated FPS 


camera, we will createour own reticle based 

of thiscamera'slocation. In the main menu, 
create a locator by going to Create>Locator. 
Locators havea variety of uses, such as acting 
asa middleman when connecting dif erent 
partsof a rig. Wewill beusing thelocator as 

our reticlein Maya. Select the locator, shift- 
select FPS_Cam, and goto Modify2Match 
Transformations>Match Translation. The locator 
will snap to FPS. Cam'slocation. Transiatethe 
locator along thez-axis so that it is directly 

in front of the camera. You should beableto 
seethelocator in the middle of theleft-hand- 
side viewport, as seen in Figure 11.5. Makethe 
locator unselectable by putting it in a referenced 
display layer. You can also lock its movement 

by going to the Channel Editor, click-dragging 
all thechannel attributes, right dicking the 
bluehighlighted selection, and dicking on Lock 
Selected (Figure 11.6). 
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Why? 


In FPS games, a reticle is a small icon, like a crosshair 
or dot, in the center of the screen that is used to assist 
the player with aiming. There will be a dif erent reticle 
created in the game engine, but our locator reticle will 
still be useful. We can reference it while posing our 
character and make sure that the weapon is pointed 
towardsthe reticle. 


Game Animations 


We are close to being ableto animate full speed ahead. 
At this point, we can start crafting our f rst pose. Game 
characters have a set of animations that will play in 

the game depending on the circumstances. One of 

the most important animations will be the idle. An 

idle animation will be playing when the player has not 
input any commands. It is meant to keep the character 
alive even though they are not performing any specif c 
movements. The idle is the f rst to be created in a set 
because it will serve as the returning point for most 
animations. When Ellen is done walking or has f nished 
f ring her gun, she will return to the idle animation. 


Translate X 
Translate Y 
Translate Z 
Rotate X 
Rotate Y 
Rotate Z 
Scale X 
Scale Y 
Scale Z 


te. ta. 
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Unmute All 


Sync Selection in Graph Editor. 
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Delete Selected 
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Make Selected Keyable 
Add to Selected Layers 


Remove From Selected Layers 
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The only time Ellen will not return to idle is after she is 
caught by the security cameras and the game Is over. 
The other animations that Ellen will need are attack, 
walk, “got caught”, and reload. 


Creating a Pose 


Animation is a time-based art form, and the illusion of 
movement is created when a series of poses are played 
one after another. When we create a pose, we will need 


to tell Maya that we want it to be played at a specif c time. 


The Time Slider at the bottom of the screen will be where 
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we def ne those times. The grey highlight is the current 
time indicator and can be changed by click-dragging left 
and right on the Time Slider. The length of your animation 
can be adjusted by entering values in the entry f elds on 
either side of the Time Slider. 


You can create the pose by translating or rotating the 
character controls that were set up in the rigging stage. 
When you are ready to save the pose, select all the 
controls and press "S" to set a keyframe. A red tick will 
appear at the selected frame number on the Time Slider. 
The key tick’s timing can be adjusted by shift-selecting 
it and click-dragging it to a new time. If you do not like 
a pose, you can remover it by selecting all the character 
controls, right clicking on the unwanted keyframe and 
pressing Delete. When there are multiple key ticks you 
would like to adjust, click-drag across those ticks while 
holding down Shift. This will create a red highlighted 
selection that can be moved or deleted. 


Once you place your f rst keyframe, do not be afraid 

to tinker with its original timing later. Getting a feel for 
the correct timing is an essential part of the animation 
process. 


Weapon Movement Simplif ed 


Onething to consider is how our character will hold her 
weapons: will Ellen carry her weapons with one hand 

or both hands? Before attaching the weapon to the 
Character, it is good to begin creating the idle pose f rst. If 
she will hold them with one hand, follow Step 8 and skip 
to Step 12. If she will hold the weapons with two hands, 
head straight to Step 9 and continue through Steps 10 
and 11. 


Step 8: Move Hlen'sright armto an upright pose. 
Theriggingf le we provide has one more 
feature we did not go over in the rigging 
chapter. It has an IK FK blend slider, located on 
theoutside of the arm (lookslikea lollipop). 

If you areusing your rig donein chapter 10, 
your arm will not move with the FK controllers. 
You need to do 2 things to make the FK work. 


Thef rst thing isto f ndleft ik wrist. ctr and 
selecttheleft wrist IK parented under it. In the 
Channel Box, set the Ik Blend attributeto Oto 
Switch to FK(set it back to 1 to switch back to 
IK). Thesecond thing is about the wrist, select 
left drv wrist; in the Channel Box, f nd thelast 
2 attributes: Left Fk Wrist Ctn WO and Left Ik 
Wrist Ctrl WL Set the Fk oneto 1 and Ik oneto 
Oto switch to FK(f ip the values to switch back). 
Thelollipop slider we provided in the rig does 
these 2 things automatically if you drag it up 
and down. The names of the controllers might 
bedif erent in therig we provided. Because of 
thelength restrictions, we removed this lollipop 
controller in the rigging chapter. However, this 
animation chapter was developed parallel 
with the rigging chapter when we havethis 
lollipop controller. Select the shoulder control 
ac r fk shoulder, use"E" on your keyboard to 
tum on the Rotate Tool and rotatethe arm so 
that it is almost parallel to the ground. Rotate 
the elbow and wrist controls, ac r fk shoulder 
andac r fk wrist, to help the arm poselook 
more natural. Translatethe gun model group, 
Gun grp, so that the gun is resting in Ellen's 
right palm. Rotatethef nger controls so that 
thef ngers are wrapped around the gun handle 
(Figure 11.7). 

Once you have solidif ed thef nger 
posing, select ac r fk wrist and shift-select 
Gun _grp in the Outliner. With the Rigging 
menu set to active, create a parent constraint 
connection between the wrist control and the 
gun group by using Constrain>Parent. Now, 
whenever the right arm moves, the gun will 
also move. 





Cam 
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Select all theammcontrols and press "S" to 

savethis poseon frameO. Head straight to Step 12. 

Step 9: For Hlen to hold the weapon with two 

hands, wewill haveto switch the arm movement 
method from forward kinematics (FK) to inverse 
kinematics (IK). Drag the lollipop sliders on both 
side of the arms down to switch to IK. (or usethe 
method mentioned at the beginning of step 8 if 
you are using your ng f le). 

Usetheac r ik wristandac | ik wrist 
controls to move Hlen’s hands upward so that 
shecan aimthegun in front of her. When you 
select oneof the controls, use ^W" to tum on 
the Translate Tool. When thearmsarein IK 
mode, they can be moved via translation and 
rotation. Keep in mind that the elbow controls, 
ac r ik drv elbowandac | ik drv elbow, 
could beused to help the posefeel more natural. 
Once you havethe anms roughly positioned in 
the lower right-hand section of the FP5. Cam 
viewport, translatethe gun group, Gun grp, 
so that the handle is resting in between Hlen’s 
hands. We will not permanently attach it just yet. 
Usethegun model asa frame of reference for 
adjusting both hands and moving Hlen'sf ngers. 
Rotatethef nger controls so that thef ngers are 
wrapped around thegun handle The left-hand 
f ngers should be wrapped around theright- 
hand f ngers (Figure 11.8). 

Select all the controls that were moved 
and press "S" to savethe pose on frame 0. 
Continueto Step 10. 





Tips and Tricks 


Be sureto be checkthe FPS Cam viewport as you pose 
the character in the perspective viewport. The gun and 
hand should end up in the lower right-hand side of the 
screen and not be blocking the reticle. 


Two-Handed Weapon Setup 


If you decided to go the two-handed weapon route, we 
will need to create a way to move both hands and the 
weapon all at once. Trying to move the hands and weapon 
in sync will be hard without tying them together using 
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locators and parent constraints. Our goal is to create a 
single NURBs curve that will move the hands and weapon 
all together. In this chapter, we will cover this setup with 
the handgun, but this system can be applied to both the 
pipe and grenade launcher. 


Step 10: Create a new NURBs circle named gun_CTRL 
and translate it so that it is positioned around the 
center of the gun and scalethecirdeup so that 
is SJightly larger than the gun mesh (Figure 11.9). 
This NURBs curve will drivethe primary 
movement of the hands and gun, so make sure 
it is easy to grab in the viewport. While holding 
down "D" trandate gun CTRLs manipulator so 
that the pivot point is at the gun handle, as seen 
in Figure 1110. 

Now we need to attach thegun to the 
new control. Navigateto the Outliner, select 
gun CTRLf rst and then shift-select Gun. grp. 
With the Rigging menu set active, create 
a parent constraint connection between 
thetwo objects by using Constrain>Parent. 
Whenever gun CTRL is moved, the gun will 
now follow. 

Step 11: To wrap up thetwo-handed weapon setup, 
we will now attach the hands to gun CTRL. 
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Createa locator named rightHand locator, 
shift-sdectac r ik wristand match thelK 
control's position by going to Modify2Match 
Transformations»Match Translation and Match 
Rotation. Shift-select rightHand locator, select 
ac r ik wrist grpintheOutliner and createa 
parent constraint so that the locator movesthe 
right hand while still giving you thefreedomto 
moveac r ik wrist. Select gun CTRL, shift- 


select rightHand locator, and then create one 
more parent constraint. Now the right hand will 





follow gun_CTRL. TherightHand locator can 
now behidden forthetime being. Repeat this 
processfortheleft hand. You will primarily use 
gun CTRLin your animation workf ow. 


Frame Rate 


Animations created for f Im and television are generally 
created at 24 frames per second. Standard playback rates 
for video games are 30 and 60fps. Always double check 
the frame rate in Maya before starting an animation. 


Step 12: Changethe frame rate from 24 frames 
per second to 30 frames per second using 
thedrop-down menu below the right-hand AGRE LI Sarchdgarearinmatian 
side of the Time Slider (Figure 1111). Go to faverdeisDirarespr sad 


Windows>Settings/Preferences>Preferences 
and click on Time Slider in the left-hand column. 
Under Playback, changethe Playback speed to 
30fps x1 (Figure 11.12). 


Idle Animation 


We will create a breathing idle animation for Ellen. It is 
possibleto create idle breakers that are animations that 
still play when the player has not input any commands, 
and they generally show a bit more personality. Our main 
idle animation will be a simple inhale and exhale with a 
touch of weight shifting. 


Step 13: Since most game animations loop 
continuously, they need to havethe same start 
and end pose. Select all controls, right dick on 
frameOonthe TimeSlider, which should contain 


Playback 


“a 7 
2A Enc vy 
1 TDS X | 


Play every frame 


30 fpsx1 
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the pose that was created when we attached the 
gun to thehand(s), and dick on Copy. Drag the 
Current time indicator to frame 60, right click 

on the Time Sider, and press Paste>Paste. The 
pose from frame 0 should now beon frame 60. 
Paste this same pose one last timeon frame 120. 
Frames 0, 60, and 120 will bethe inhale moment 
of theidle. Havethe gun move downward on 
frame 30, set a keyframefor all the controls 

by pressing "S", and do the sameon frame 90. 
Your Time Slider should look liketheonein 
Figure 11.13. 

Theshortcut to play and pausean 
animation isAlt +V”. Playthrough your 
animation to make surethat the posesf ow 
togeher and the overall movement makes 
Sense. 


Tips and Tricks 


In the beginning stages of an animation, it is smart to set 
a key on all the controls each time you create a main pose. 
Adjusting the timing will be easier since you will know 
that all controls have been accounted for in each of the 
main poses. 


Step 14: Add a simple weight shift to add more 
variation to the breathing. On frame 60, havethe 
hands and gun movetowards our right a tiny bit. 
Fromframes Oto 60, Alen will weigh shift to our 
right, and fromframes 60 to 120, she will retum 
to the idle pose by weight shifting to our left. 


Cleaning Up Odd J itters 


You might start to notice weird glitches in the animation, 
even if you did not set any specif c keys to def ne that 
movement. Right clicking on the timeline and pressing 
Tangents>Auto should remove those hitches. 





Ease-In's and Ease-Out's 


The main poses have been set for the idle animation, 
but the movement might feel f oaty. There is no sense 
of weight in the animation yet. We can insert additional 
keyframes to help show ease-in's and ease-out's. This 
is important to utilize in your animations because most 
movements take time to start up and come to a natural 
stop. Ease-in's and ease-out's can also be used to add 

a moment of hold. If you take a deep breath in real life, 
your upper body will hold still for a few seconds before 
exhaling. That stillness is like an ease-in. When you exhale, 
you are gradually easing out of the inhale "pose." 


Graph Editor 


Animators must become acquainted with the Graph Editor 
to f netune their work. All keyframes are represented on 

a graph as plotted points that can be adjusted, and the 
interpolation between each keyframe is represented 

as curves. With a basic understanding of curves, the 

Graph Editor can be used to create quick ease-in's and 
ease-out's. 


Tips and Tricks 


Try opening the Graph Editor by going to 
Windows>Animation Editors>Graph Editor. If you have 

a second monitor available, | suggest having the Graph 
Editor maximized on one screen. If you have one monitor, 
you can have it open on one of the viewports by going to 
Panels>Panel>Graph Editor. 


Step 15: Select ac r fk shoulder if you are 
animating just one armor select gun CTRL if you 
areanimating both hands holding the weapon. 
Openthe Graph Editor. On theleft-hand side, 
select the primary channel that is responsible 
for the upward and downward movements. For 
theone-handed weapon setup, select Rotate Y, 
and for thetwo-handed weapon setup, select 
Translate Y. That specif c channel istheonly one 
that is visible (Figure 11.14). If you cannot seethe 
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green curve clearly, press “F” to quickly zoomin 
towards the curve. 

Similarto scrubbing through the Time 
Slider, you can adjust thetime by click- 
dragging the yellow Current Time Marker 
left and right within the Graph Editor. Select 
the Insert Keystool in the upper right-hand 
comer of the Graph Editor and dick on the 
curveto insert keys on frames 13, 25, 35, 46, 
73, 85, 95, and 106. Press “W”, dick on frame 
13, and middle-mouse-dick-drag it upwards 
closer to frameO. Grab frames 25 and 35 and 
middle-mouse-dickedrag those keys towards 
frame 30. Continuethisforthe remaining 
keysthat wejust added. Refer to Figure 11.15 
for a general idea of how your curve should 
look. Do not worry if it is not an exact replica. 
Theanimation should havea slight moving 
hold each timethe character inhales. 


Why? 


Understanding what the curve shapes represent is more 
important than just simply copying. The curve shape from 
frames Oto 13 is an ease-out. The gentle slope represents 
small movement over a long period of time. We know 
that frames 13-25 will be faster due to the steep slope 
that showcases a large value change over a short period 
of time. Frames 25-35 is another ease-in. Ease-in's and 
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ease-out's help vary the spacing between each main pose 
and helps add more weight to the movement. 


Keywords Aside 


Timing isthe object's speed, while spacing is how the 
object will move from point A to point B. Spacing will 
help determine moments of acceleration and moments 
of hold. 


Tips and Tricks 


When you are adding ease-in's and ease-out's, you do not 
necessarily have to select all the controls and press “S”. 

At this stage of the animation, you can be more selective 
with keyframe placement. 


Attack Animation 


The attack animation is up next. The gun f ring should 
be rapid and impactful. As soon asthe player presses the 
button to attack an enemy, we want the player to see and 
feel an immediate response in the gun. A combination 
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of fast timing and careful spacing consideration help us 
achievethis goal. 


Step 16: Select all the controls, copy thef rst frame 
of theidle animation, and pasteit on frames 200 
and 212. Frame 200 will bethe start of the attack 
animation, and 212 will bethe end. On frame 
204, createthe recoil pose by moving the gun 
back closer to Hlen and rotatethe gun so that 
itis pointing upward. Maya should now show 
theinitial movement between frames 200 and 
204, but it is still too dow. To help show nappy 
gunf re, movethe gun backwards towards Hlen 
on frame 201 

Step 17: Let's add somef nal touches to the attack 
animation. Set a keyframe on frame 208 for 
themain movement control. Open the Graph 
Editor and create an ease-in using thenewly 
added keyframe. Go through all the Trandate 
and Rotate channes on theleft-hand-side bar 
to check if there is a moving curveto add an 
ease-in. Figures 11.16 and 11.17 aretwo examples 
of howthis ease-in could beimplemented on 
frame 208. If thereis a horizontal line instead 
of a trending curve this meansthat thereis 
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no movement, so you will not need to add the 
ease-in for those specif c channels. Once you 
havef nished this step, the animation should 
cometo a morenatural stop. 


Walk Animation 


A basic walk animation consists of the following main 
poses: contact, down, passing, up, and back to contact 
pose to repeat the cycle. This animation will be simpler 
to create asf rst-person shooter animation in contrast 
to a full-body piece, but we can still move the arms and 
weapon in accordance with the main poses. 


Steo 18: Begin the walk cycle by setting down the 
contact poses. Select all controls, copytheidle 
posefrom frame 0, and paste a key on frames 
300 and 331. Slightly rotate the gun so that it 
points to our left on frame 315. On contact pose, 
the upper body will twist the most sideto side. 

Step 19: The next poseto block isin the passing pose, 
which isthe halfway point between each contact 
pose. On frame 307, translate the character to 
our left, and on frame 323, translate her to our 
right. The character has shifted their weight the 
most to the left or right on passing pose. 
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Step 20: We will f nish blocking in the walk with 
thedown and up poses. The character should 
translate down on frames 303 and 318, and she 
should translate upward on frames 312 and 327. 
The gun should also rotate down and up, but 
wecan add an of set in therotation'stiming so 
that movement feels looser and more broken up. 
Rotatethe gun down on frames 308 and 324 and 
add in an upward rotation on frame 316. 

Step 21: Asa f nal touch, add ease-in's and ease- 
out'sto makethe animation feel less even. 
Figures 11.18 and 11.19 showcase how the 
ease-in's and ease-out's could beapplied to the 
contact and passing main keys in the Graph 


Editor. 





"Got Caught" Animation 


When Ellen is caught by one of the security cameras, she 
will raise her hands up in shock. If you are animating her 
with both hands on the weapon, we will need to detach 
one of the hands fromthe gun handle. This animation will 
be "game over" for the player, so we do not necessarily 
haveto loop the animation. 
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Step 22: Select all the controls, copy the idle pose, 
and paste it on frame 400. If you are animating 
with thetwo-handed weapon setup, select 
leftHand_locator and makesure that it also has 
a keyframeat 400. If the locator did not have 
any keyframes placed beforehand, you should 
notice a new attribute in the Channel Box called 
Blend Locatorleftparent 1. On frame 400, Blend 
Locatorleftparent 1 should be set to 1. To detach 
theleft hand fromthegun handle, change 
Blend Locatorleftparent 1 to O on frame 40L 
HideleftHand locator while you createthe "Got 
Caught" animation. You can now moveac 1 ik - 
drv wrist independently of gun CTRL. 


Tips and Tricks 


Remember to select leftHand locator and change 
Locatorleftparent 1 backto 1 when you want the left hand 
to be attached to the gun handle again. 


Step 23: Createthelast pose of the animation on 
frame 426. Theright hand still holding thegun 
will moveback and movetowards the right of 
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the screen. Movetheleft hand towardsthe left 
edge of thescreen and spread thef ngersout 
(Figure 11.19). 





Keywords Aside 


Depending on the speed of an action, we might need to 
add an overshoot pose to give more time to the audience 
to take in what just happened. The overshoot will move 
past the last pose we just created and will settle into the 
last pose more slowly. 


Step 24: Let's add in an overshoot to both handson 
frame413. Select all controls, copy frame 426, 
and pasteit on frame413. This will beour starting 
point for the overshoot pose. Theleft hand'slast 
pose ends up closeto theleft sdeof the screen, so 
theovershoot will bea tiny continuation of that 
movement. Translate and rotatetheleft hand ever 
so Slightly to theleft, and do thesamefortheright 
hand, except towards thenght-hand sdeof the 
screen. Theleft-hand f ngerscan also bea part of 
theovershoot. Rotatethef ngersto theleft just a 
tad bit (Figure 11.20). 

Step 25: Wecan createa moref uid motion in both 
hands by examining their motion trail. Select the 
left-hand control, and with the Animation menu 
Set active, go to Visualize>Create Editable Motion 
Trail. A curve representing the left hand's path of 
action hasnow appeared (Figure 11.21). When 
you add a keyframeto that control, the motion 
trail should update. Movethe hand downward 
on frame 402 so that it will dip beforetraveling 
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to the main pose on 406. In your perspective 
viewport, zoom in doseto the motion trail at 
frames 413- 426. Add additional keyframes to 
create a more rounded shapein the motion trail 
(Figure 11.22). Compare Figures 11.21-11.23. The 
motion trail has more apparent arcs. Go ahead 
and delete motioniraillHandlein the Outliner. 
Repeat this entire step for the other hand. 
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Why? 


Most living beings move in arcs, while machinery tend 
to move in a linear fashion. Exaggerating the arcs of an 
object's motion trail can be a quick way to add a layer of 
f uidity to the animation. 


Step 26: Usethe Graph Editor to assist in creating a 
natural settlefor the ending of the animation. 
Add an ease-in at frame 416. 


Reload Animation 


Thereload animation will be a culmination of everything 
that we have covered, as well as adding one more object 
for Ellen to interact with. If the two-handed setup is in use, 
the left hand will need to leave the gun handle once more. 
The added challenge is that we must get the character 

to retum to the idle pose, in contrast to the "Got Caught" 
animation that did not haveto loop. In this animation, 
Ellen will f rst shake the empty magazine out of the gun. 
Her left hand will temporarily leave the screen to grab the 
new magazine. Once the left hand returns to the player's 
view, Ellen will reload the gun, and the left hand should 
return to its original idle pose. 


Step 27: We will create a systemin which the 
magazine can beattached to either the gun 
or left hand. Createan empty group named 
gunClip CTRL group. Match thegroup's 
transformsto Gun dip grp. Createa locator 
named gunClip Locator, match itstransforms 
toGun dip grp, and makeit a child of 
gunCip CTRL group. Select gun CTRL, shift- 
select gunClip CTRL group, then createa 
parent constraint so that the magazine will now 
follow the main gun control. Select theleft- 
hand control, shift-select gunClip Locator, and 
createa parent constraint so that wecan tell the 
magazineto follow theleft hand. 

At thestart of thereload animation, 

we will want the magazineto befollowing 
the gun control. Let'stum of thegunCip_ 
Locator's constraint for thetime being. 





With the locator selected, change Blend 
Parent T's valueto 0. 

Step 28: Start of the animation by copying theidle 
pose and pasting it on frame 500. At frame 510, 
have the left hand completely leave the screen 
and raisethenght hand up in anticipation for 
theshake. Create the right hand's lowest point 
intheshake at frame 515, and have it nsejust a 
little to settleinto the main pose at frame 526. 
Use gunCip Locator to translatethe magazine 
out of the gun from frames 512 to 522. Select 


gunCip Locator, set a key on frame 500 and 5D, 


and ensure that Blend Parent 1 is 0 on thosetwo 


keys. Change Blend Parent 1to 1 on frame 529 so 


that it will beattached to theleft hand. 

On frame 538, rotatethe right hand 
towards thecamera. Bring theleft hand 
backup into view with the magazine resting 
against the bottom of the gun grip. You can 
also rotatethef ngers so that they havea 
better grip on the magazine (Figure 11.24). 

Step 29: Let's continuethe second half of the reload 
animation. On frame 545, movethe left hand 
up and to our right so that the magazine can 
be reloaded into the gun. Theright hand should 
also slightly movein reaction to the left hand's 
movement. The magazine will need to switch 
parents fromthe left hand to the gun control. 
Makesurethat gunClip Locator's Blend Parent 
lissetto 1on frame 538. Change Blend Parent 1 
to Oon frame 54L If the magazine rotates oddly 
on frames 539 and 540, go ahead andf xit by 
rotating the magazineto align with thegrip. 
Pastetheidleposeon frame 564. 
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Step 30: Add f nal touches to the animation. Track 
each hand's motion trails and see if you can 
round out any arcs. Use ease-in's and ease- 
out'sto create a moving hold for the key poses 
on frames 526 and 538. Finally, havethe gun 
cometo natural settle at the end with a gradual 
ease-in to the last pose. 


Considerations and Conclusion 


Once you have created your f rst animation set, animating 
the grenade launcher and pipe will both be a familiar and 
new process. While the other weapons’ movement will 
not be the same as the handgun, most of the main poses 
should remain the same. There are some dif erences in 
the story that is told through each weapon. The grenade 
launcher and pipe might have slower timing since they 
are heavier than a handgun. The pipe will not have its 
own reload animation because it is a melee weapon. The 
grenade launcher will only be able to hold one grenade at 
atime, so you will not need to animate Ellen shaking away 
an empty cartridge. 


Animation can be easy to pick up, but there are still 
obstaclesto consider from both a technical and artistic 
standpoint. Have fun and challenge yourself to create 
believable, responsive movement. 





Unreal Character 
Asset Creaton 





In the previous chapters, we have our character modeled, 
textured, rigged, and animated. It’s alot of ef ort to make 
a working character, but now it’s all behind us. In this 
Chapter, let's move back to our Unreal Engine project and 
start importing our character assets. 


We are going to get the model into our Unreal Engine 
project, create the materials, and import the animations. 
After getting our own assets in, we are also going to cover 
how to get motion captured data to our character. With 
motion capture, we don't have to do all the animations 
from scratch. 
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If you want to use the character we did for this book, it's 
in the support f les. However, we highly encourage you 
to usethe one you did. The best way to know if you did a 
good job or not isto put the work you did into the next 
step of the production and test it. 


Tutorial 12.1: Character 
Asset Import 


Step 1: Unparent the models and thejoint. Open the 
rigfle(Blen rig.mb) with Maya. Find theroot 
joint of therig and press Shift +P to unparent 
it. Select All the models of the Character (not 
induding the gun) and also unparent them. 


Why? 


Why do we unparent the model and the joints? Well, if we 
don't, Maya may still export their parent groups and the 
world ctr controller. These extra nodes are not helpful 
and only make the asset heavier. We also ignore the gun 
because it is considered as another object; we are going 
to attach it to the hand in the game engine. 


Step 2: Export Skeletal Mesh. Select the models and 
thejoint we unparented in Step 1. Go to File> 
Game Exporter. In the pop-up Game Exporter 
window, changethe Export All to Export 
Selection. Click on thefolder icon in the Path 
settings, choosethe assets folder, and click the 
Choose button. Typein Elen Skeletal Mesh 
asthef lenamein the Enter a f lenametext 
f eld. Pressthe Export button to f nish exporting 
(Figure 12.1). 

Step 3: Prepare a base material instance. Go back 
to our game project. Create a new folder 
called Blueprints, and add a new folder called 
Charactersin it. Open the Charactersfolder and 
create a new folder called Elen. Create a material 
instance based on theSubstance Base Mtl 
and put it into the Elen folder; namethe new 
material instanceHlen Base Mtl Int. 

This Blueprintsfolder will bethe master 
folder for our character and many other 


IM Game Exporter 


Mode 
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things, and wearegoing to explain what 
blueprint is in thefollowing chapters. 

Step 4: Import Elen to Unreal Engine. Clickthe 
Import button in the Content Browser, f nd the 
Hlen Skeletal Mesh weexported in Step 2, 
and double dick it to import it. In the pop-up 
FBX Import Options window, click the Reset 
to Default button. Make surethat the Import 
Animations checker box is of , scroll down to 
the material section, and set Material Import 
Method to Create New Instanced Materials. Set 
the Base Material Nameto Hlen Base Mtl Inst. 
Thereisa list of attributes we can override. 
Knowing that all textures and material setup 
from Maya is not compatible with Unreal Engine, 
wejust override all properties with a random 
pick. If wedo not override, Unreal is going to 
create materials instead of material instances. 
Press theImport All button (Figure 12.2). 

Step 5: Export and assign textures. Select all the 
textures imported from Elen Skeletal Mesh 
and simply deletethem. Go to our Substance 
Painter f le and export thetexturesthere with 
the same setting we did for our environment 
models. Import thesetexturesto our game 
project and attach themto the various material 
instances. 


FBX Import Options 
Import Skeletal Mesh Reset to Defaul 


Current Asset: /Game/Blueprints/Characters/Ellen/Ellen_Skeletal_Mesh 


4 Mesh 
Skeletal Mesh 3 
Import Mesh 3 


Import Content Type Geometry and Skinning Weights. v - 


Skeleton 


4 Animation 


Import Animations O 


Animation Length 


4 Transform 


Import Uniform Scale TORRE 


4 Miscellaneous 
Convert Scene 
Force Front XAxis 


Convert Scene Unit 


4 Material 
Search Location 


WEN a Create New Instanced Materials v - 


Ellen-Base-MtlI-Inst 


e p 


Base Material Name 


Base Color Property ColorMult 


Ss 


Base Texture Property 


Eerie tert 


Base Normal Texture F 


Eucla ColorMult 


Base Emissive Texture 


Base Specular Texture 


¿olean All Properties isi 


Import Textures 


Invert Normal Maps 


Reorder Material to Fbx 


4 Fbx File Information 
File Version 7.5.0 


File Creator FBX SDK/FBX Plugins version 2020.0.1 


Cila Deantar Amm m 
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Step 6: Organize the assets. There are currently 
many assets in the Elen folder. Create a folder 
called Material and moveall textures and 
material instances to that folder. Now we 
have only a Material folder and three more 
assets in the Hlen folder. Let's explain these 
three assets: 


Skeletal Mesh, Skeleton, 
and Physics Asset 


A skeletal mesh is a mesh with joints. The one with the 
purple bar is our skeletal mesh. Double click to open it, 
and you can see all the materials assigned to it in the 
Asset Details panel. Click on the Skeleton Tree table on 
the right of the Asset Details tab, and you can see all the 
joints listed in it (Figure 12.3). We can import animations 
for these joints or animate them here. There are two 
more assets created with our Ellen Skeletal Mesh. Ellen - 
Skeletal Mesh PhysicsAsset isthe asset that def nes 

the collision and physical material of the model. Ellen _ 
Skeletal Mesh Skeleton isthe skeleton structure of Ellen. 
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Because multiple assets can share the same skeleton, 
Unreal de-couples the skeletons and the meshes. 


Step 7: Skin Material. Unreal offers a dedicated 
skin-shading model. Go to the shared folder 
that we have our Substance Base Mtl. Select 
Substance Base Mtl and press Ctrl +Wto 
duplicateit. Namethe duplicated material 
Substance Skin Base Mtl, and double 
dick to open it. In the Material Editor, go 
to the Details Panel. Under the Material 
section, set the Shading model to Subsurface 
Profile. Create a new ScalerParameter 
and call it SubsurfaceScattering. Connect 
SubsurfaceScattering to the Opacity input 
pin of the Substance Skin Base Mtl node 
(Figure 12.4). Pressthe Save button to save 
the changes. 

Step 8: Set uptheskin material with a prof le. 
Open the Body Mtl of Elen, and se its parent 
to Substance Skin Base Mtl. Checkonthe 
SubsurfaceScattering parameter and se its value 
to 1. Under the Material Properties Overrides 
section, check on Subsurface Prof le. Click 
onthedrop-down list, and select Subsurface 
Prof leunder the Create New Asset section. In 
the pop-up Save Asset As window, navigateto 
Content/ Blueprints/Characters/Hlen/Material. 
Typein HlenSkinSubsurfaceProf le asthe Name, 
and press Save (Figure 12.5). 

Drag an instanceof Hlen Skeletal Mesh 
tothesceneand takea look, and you can 
see how the skin of the Characterfeelsf eshy 
(Figure 12.6). 
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Subsurface Scattering 


When light rays hit surfaces like skin, wax, leaf, or plastic, 
a small number of the rays penetrate through the surface 
and scatter inside. Some of the scattering light rays may 
travel back out of the surface, which makes the surface 
of the object looks blurred. This phenomenon is called 
subsurface scattering. How much the light is scattering 
and the color is def ned in the subsurface prof le. 


Step 9: Tweak the subsurface prof le. Double dick 
to open HlenSkinSubsurfaceProf le. There are 
two types of subsurface Burley Normalized 
and USubsurface Prof le. Burley Normalized 
ismore accuratethan USubsurface Prof le; 
check on Enable Burleyto enableit. The Mean 
Free Path Distance controls how far the lights 
scatter inside; adjust it, so it is not too blurry. 
Other settings should be good for normal 
human skin; feel freeto hover the cursor on these 
settingsto see what they do (Figure 12.7). 
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Step 10: Export the FPS skeletal mesh. The FPS 


skeletal mesh isthe same model without the 
head and bottom part of the body. We could 
do sometrick in the game engineto hidethese 
parts (like scaling the head joint down to zero 
to hidethe head), but commonly this should be 
a dif erent model. Go ahead and export the FPS 
skeletal mesh the same way we exported the 
full-body one. The only dif erencehereisthat we 
do not select the models we do not wish to see. 
Figure 12.8 showsthe models selected. 
Namethe FPS skeletal mesh 
Alen FPS Skeletal Mesh. 


Step 11: Import the FPS Skeletal mesh. Clickthe 


Import button in the Content Browser and 
select Hlen FPS Skeletal Mesh. In the pop-up 
FBX Import Options window, make surethat 
the Skeleton setting is Hlen Skeletal Mesh _ 
Skeleton. Check of Import Animations, and 
set the Material Import Method to Do Not 
Create Material. Pressthe Import All button 
(Figure 12.9). 

Thereshould beonly two assets 
imported: Hlen_ FPS Skeletal Mesh and 
Alen FPS Skeleal Mesh PhysicsAsset. The 
materials should be automatically connected, 
and they sharethe same skeleton as well. 
However, if you made a completely dif erent 
model for your FPS character, you should 
import it asa new one. Figure 12.10 shows 
what'sin the Hlen folder after importing the 
skeletal meshes. 

Now we havethe visuals done, let's get 
theanimationsout. 
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FBX Import Options 
Import Skeletal Mesh 
Current Asset: /Game/Blueprints/Characters/Ellen/Ellen_FPS_Skeletal_Mesh 
4 Mesh 
Skeletal Mesh e 
Import Mesh 5 


cb E Geometry and Skinning Weights. v 


iE _ Ellen_Skeletal_Mesh Skeleton v 


Vo epos 


Skeleton 


4 Animation 


Animation Length 


4 transform 
Ò Import Translation 


Ò Import Rotation 


Import Uniform Scale 


4 Miscellaneous 
Convert Scene 
Force Front XAxis 


Convert Scene Unit 


4 Material 
Search Location 
Material Import Method 


Import Textures 
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Tutorial 12.2: Export 
FPS Animations 


Step 1: Bake Animations. Open the gun animation 
fle(Hlen gun animations.ma) in Maya. Select 
theroot joint, go to select Hierarchy to select 
all the joints undemeath, and go to Edit 2 
Keys BakeSimulation [ ]. In the pop-up Bake 
Simulation Options window, make surethat 
theTimerangeistherange of the Animation 
you want to export. In our case, thetimerange 
should betherangethat appears on the Time 
Slider, so the default setting is good for us. If 
yours isnot the same asthe Time Slider, set the 
Timerangesetting to Start/End and spedfy 
your Start and End Timeto bake. Pressthe Bake 
button to bakethe Animation. 


Bake Animation 


Game engines understand joint skinning, but not 
the iks, controllers, and constraints. We need to bake 
our Animation to the joints so that the Engine can 
understand it. 


Step 2: Export Animations. Unparent the models 
in theviewport and the root joint (again not 
induding thegun). With the models and the 
joint selected, go to File Game Exporter. 
Inthe pop-up window, click on the Animation 
Clips tab. Set the Export All to Export Selection. 
Click on the "4" sign under the Animation Clips 
section to add a new dip. TypeldleintheClip 
Namef eld. Se the start valueto 0, and the End 
valueto 120. 0-120 is ourframerangeforthe idle 
Animation. Add another dip and call it Attack, 
and set itstimerangeto 200-211. Add one more 
dip and call it Walk; forthisone, thetimerange 
isset to 300- 330. Following the sametrend, 
add two more clips for the Caught and Reload 
Animation (all these time ranges are based 
on the Animation you did). Click on the folder 
button of the Path setting, navigate to your 
assets folder of our Maya project, and click the 
Choose button. Finally, typein Alen FPS Gun_ 
as the Cip File Pref x and press the Export button 
(Figure 12.11). Go ahead and export all other 
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Animations thesame way, including both the 
pipe and the grenade launcher. 

Step 3: Import animations to our Unreal Engine 
project. Go backto our Unreal Engine project. 
Go to the asset folder of our Maya project, and 
drag theanimations we exported thereto the 
Hlen folder. In the pop-up FBXImport Options, 
makesurethat the Skeleton setting is Hlen_ 
Skeletal Mesh Skeleton. Because we havethe 
meshes already, check of Import Mesh. Pressthe 
Import All button to import all the animations 
(Figure 12.12). 
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Al FBX Import Options 
Import Animation Reset to Default. 
Current Asset: /Game/Blueprints/Characters/Ellen/Ellen_Shoot 


4 Mesh 


Import Mesh E| 
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Skeleton 


4 Animation 


Animation Length 


4 Transform 
D Import Translation 
Ò Import Rotation 


Import Uniform Scale 


4 Miscellaneous 
Convert Scene 
Force Front XAxis 


Convert Scene Unit 


A Fbx File Information 
File Version 7.5.0 
File Creator FBX SDK/FBX Plugins version 2020.0.1 
File Creator Application Autodesk Maya 202001 
File Units centimeter 
File Axis Direction Y-UP (RH) 
File Frame Rate 30.00 
Animation Start Frame 200 


Animation End Frame 211 
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Tips and Tricks 


Because our FPS mesh and the full-body mesh are using 
the same skeleton and the same materials, we do not 
want to create new materials and skeletons. If you could 
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share the same skeleton across multiple assets, you can 
also share the same skeletal Animation. 


Step 4: Organizethef lesinto folders. The 
animations havea dark green bar at the 
bottom of their icon. Create a new folder called 
Animations and moveall theanimationsto that 
folder. Forthe rest of the assets, movethemto a 
new folder called MeshAssets. 


Tips and Tricks 


Organizing the folders is critical to avoid confusion and 
mistakes. Remember, people got f red because they didn't 
organize their folders. 


Now we have the FPS animations in, let's talk about 
motion captured data and Animation retargeting. We are 
going to leverage a free online motion capture library 
called Adobe Mixamo. They have a decent collection of 
animations we can use. 


Tutorial 12.3: Motion 
Captured Data 


Step 1: Prepare our model. Open thengf lein Maya 
again. Select all the body models (not including 
the gun). Press Ctrl +D to duplicate them, then 
Ctrl +Gto group the duplication, and f nally, 
press Shift +P to un-parent the group; name 
the group Model to Mocap. With the group 
selected, go to File Export Selection. Set 
theFilenameto Elen NPCand changethe 
Fileof typeto FBX. In the Options panel, check 
of the Embed Media (optional, but texture 
f lestaketoo long to upload). Export it to the 
assets folder. 

Step 2: Upload itto Mixamo. Open your web browser 
and search for Adobe Mixamo. Thef rst one pops 
up with the link www.mixamo.com should be 
theone we need to go, but it might be dif erent 
bythetime you read this book. Pleasetryto f nd 
themost relevant one. Open the website, log in 
if you havean adobe account, sign up for free 
if you don't. After logging in, go to the upper 





right comer of the page and click on Upload 
Character. In the pop-up UPLOAD A CHARACTER 
window, click on Select character f le. Locate and 
open the Elen _NPC.fbx we exported in Step 1. 
It may takea whilefor the character to upload; 
oncetheuploading isf nished, you should 
seethe character appear in the window. Press 
Next, and follow the instructions to placethe 
landmarks of the body to our character. Press 
next, wait for it to f nish ngging, and next again 
tof nish thesetup (Figure 12.13). 

Step 3: Search and preview animations. Click on 
the Animations tab at thetop left comer of 
the webpage. Search for pistol in the search 
bar. In thesearch result, f nd and dick on the 
onenamed the Pistol Walk. Our character in 
the viewport on theright should already be 
previewing it. We don't want the character 
to moveforward in this case. Check on the 
In Place checker boxto lock it at the origion 
(Figure 12.14), 


UPLOAD A CHARACTER 


Hi there! 


To upload your character to Mixamo, drag and drop your 3D character File! 
drop zone. Need instructions? Learn how to prepare your model or read Al 


L3 c2 E 





drop character file here. 
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PISTOL WALK ON ELLEN NPC 
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Why? 


So why do we want the character to bef xed in place? 
Well, the motion of the character should be taken care 

of bythe game programming and not driven by the 
Animation. You don't want the Animation to tell you how 
fast your character should be moving. 


Step 4: Download animations. Presstheorange 
download button. In the pop-up DOWNLOAD 
SETTINGS, set the Frames per Second to 60. 
Pressthe DOWNLOAD button to download 
theAnimation. Go ahead and download the 
Shooting, Pistol Idle and Death From The 
Back the sameway. Createa new folder called 
MixamoAnimationsin theassetsfolder and put all 
four downloaded animations there (Figure 12.15). 

Step 5: Import skeletal mesh. Go backto our 
Unreal project. Createa folder named Mixamo 
underthe Animationsfolder. Import the 
downloaded Pistol Walk with the setting shown 
in Figure 12.16. 

Step 6: Import therest of the mixamo animations. 
Import the rest of the animations, but this time, 
check of Import Mesh (Figure 12.17). 


Why? 


Unreal Engine requires a skeletal mesh to import animations, 
so we have to create one in Step 5. However, for the rest of 
the animations, they can use the same skeletal mesh. That's 
why we checked of the Import Mesh settings in Step 6. 


We are going to use these animations for our NPC, but 
there is a problem. These animations are for the skeleton 
done by Mixamo; double click to open Pistol Walk - 
Skeleton, and you can see the skeleton tree is not the 
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AL FBX Import Options 


Import Skeletal Mesh Reset to Default. 
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same as our Ellen Skeletal Mesh Skeleton (Figure 12.3). 
Because of the dif erence, they cannot use each other's 
animations. It's bad practice to have the same model 
using dif erent skeletons with dif erent animations 
unless you have a good reason. Let's use Unreal 

Engine's Animation retargeting feature to transfer these 
animations to Ellen Skeletal Mesh Skeleton. 


479 


FBX Import Options 
Import Animation Reset to Default. 
Current Asset: /Game/Blueprints/Characters/Ellen/Animations/mixamo/Pistol_ 
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4 Transform 
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4 Miscellaneous 


Convert Scene 
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4 Fbx File Information 
File Version 7.4.0 
File Creator FBX SDK/FBX Plugins version 2014.2.] 
File Creator Application Autodesk Maya 202001 
File Units centimeter 
File Axis Direction Y-UP (RH) 
File Frame Rate 60.00 
Animation Start Frame 0 


Animation End Frame 47 
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Tutorial 12.4: Animation 
Retargeting 


Step 1: Set up a Rig. Open Pistol Walk Skeleton. 
dick on the Retarget Manager button in the 
toolbar. The Retarget Manager now appears on 
the left sde of the window. Under the Set up Rig 
section, click on the drop-down list of Select Rig 





Select eds 


Source 
Root 
Pelvis 
spine 01 
spine_02 
spine_03 
clavicle_| 
UpperArm_L 
lowerarm_] 
Hand_L 
clavicle r 
UpperArm. R 
lowerarm_s 
Hand_R 
neck 01 
head 
Thigh 
calf | 
Foot L 
Thigh. R 
calf r 


Foot R 


and select the Humanoid Rig. A wholelist of 
bone names appears at the bottom of the UI. Go 
to the viewport, go to Character Bones, check 
on the Bone Names, and set the Bone Drawing 

to All Hierarchy. We can now seeall the bones 
(joints) of the skeleton. Follow the assignment 
shown in Figure 12.18 to set up all thetargets on 
thelist. What wearetrying to do hereisto set the 
targetsto bethe equivalent ones of the sources. 


Step 2: Set upthe advanced ones. Click on theShow 


Advanced button to switch to the advanced 
targeting. This area includes small thingslike 
f ngers and ball joints. Figure 12.19 shows the 
assignments, and you only haveto set up the 
Selected ones. 


Step 3: Set up preview mesh. Go to the toolbar again 


and click on the Preview Mesh button. Select 
Pistol Walk asthe preview mesh. Look at the 
lower nght comer of your screen and you can see 
a notif cation. Pressthe Apply To Asset button 

on it to set the preview mesh permanently 
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Source 
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(Figure 12.20). This preview mesh needsto be set 
for our retargeting to work. 

Step 4: Setup Hlen Skeletal Mesh Skeleton. Go 
to Blueprints/Characters/Hlen/MeshAsset, f nd 
ourHlen Skeletal Mesh Skeleton, and repeat 
Steps 1-3 on it. Thetarge assignment is shown 
in Figure 12.21. 
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Now wehaveourtwo skeletons all 
targeted to thesame source hierarchy, and 
they can now copy animations from each 
other through thetarget— source mapping. 

Step 5: Transferring Animation. Go back to our 
mixamo folder, right dick on Pistol Idle, and 
select Retarget Anim Assets > Duplicate 
Anim Assets and Retarget. In the pop-up 
Select Skeleton window, select Hlen _ 
Skeletal Mesh Skeleton and hit Retarget 
(Figure 12.22). Anew animation with the 
same nameas Pistol Idle got created in the 
root directory of the content browser. This 
new Animation is now working with our 
Hlen Skeletal Mesh Skeleton. 

You may haveto go back and check 
theassignment of thetargets if you see bad 
results. It is easy to select the wrong joints. 

Step 6: Retarget the rest of the animations. Select 
the other three animations together and repeat 
Step 5. Select all the retargeted animations and 
movethemto the Animations folder. 

Step 7: Fix retargeting issues. Open Pistol Walk - 
Anim, zoomin, and takea closer look. You 
can seethat the arms and thelegs aretoo far 
apart. Thisis becausethetwo skeletons are 
not positioned the same. Go to the Skeleton 
Tree, dick on Options and check on Show 
Retargeting Options. A new column called 
Translation Retargeting appears. Right click 
on the Animation drop-down list of thef rst 
row and select Recursively Set Translation 





At 


Select Skeleton 
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Retargeting Skeleton. What this does is basically 
saying, thetranslation of the joint remains 
thesameasthe skeleton, not following the 
Animation (the rotation still does). Set the Root 
and Root 01 back to Animation afterward 
(Figure 12.23). 

Alrighty, now we haveall the animations 
we need. Figure 12.24 shows our animation 
library. 
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Conclusion 


We now have all of our character assets set up and 

ready to go. We are also f nally done with the character 
creation process. Character modeling is one of the most 
challenging jobs in the game and animation industry. 
Modeling, texturing, material, rigging, animation, and all 
these things have to work together beautifully to bring a 
character alive. It will go through many hands during the 
process, and if any of the processes messed up, it takes 
quite a lot of rework to f x it. 


We have also hit a signif cant milestone as we have 

of cially done with making assets. We are ready to jump 
into a completely dif erent task— programming. Buckle up 
because the real bumpy road is about to begin! 








Game is no fun without interactions, and programming 
is the tool to achieve that. Programming is a dif cult 
task, not because the languages are hard, but the logic 
and algorithms you haveto implement. There was a joke 
about what programming is: 


Programming isto teach the stupidest thing in the 
world to do stuf . 


The stupidest thing referred to in this joke isthe 
computer. It is stupidly fast, but also blindly stupid. 
Computers follow instructions to the letters, and they only 


n Creating Genes wth Urad Engine Suostane Parts; &Maa 





do whatever you told themto do. If you ask a computer to 
self-destruct, it is going to self-destruct without hesitation 
or any sense of self-preservation. There is no intelligence 
when computers execute their programs nor does it 
understand your real intension. 


With that being said, you, the programmer, take full 
responsibility for what happened. We, as humans, can 
make mistakes. We could forget things, and we could 
misunderstand a problem. It is not uncommon that a 
programmer, even professional ones, would have to write 
and rewrite a piece of code several times to understand 
the task thoroughly. It takes even more time to know how 
to do takes ef ciently, and worst of all, how errors should 
be handled properly. 


Relevant Programming 
Languages (From Hard to Easy) 


C++ 


For game engines like Unreal Engine or Unity, and all the 
software we have been using, the foundation or low- 
level programming is done with C++(pronounced as C 
Plus Plus). C+++or CPP is the foundation of many modem 
languages, it runs on every hardware, and it can squeeze 
every bit of performance out of the computers. Cis 
also the most dif cult language to master. Scott Meyers, 
the world's foremost authorities on C; describes C++ 
as a party of f ve languages or programming styles in his 
famous book Ef ective C++: 55 Specif c Ways to Improve 
Your Programs and Designs (Addison-Wesley, 2005). 
Because of its complexity, programmers came up with this 
famous joke: 


No one really knows C++ 


C+thas direct access to the hardware, which, in theory, 
when used properly, can produce the most performant 
software. C++is often the answer to software that needs 
excellent performance. 





C# 


CX pronounced as C Sharp, is a high-level programming 
language. C#simplif es most of the complex aspects of 
C+tand provides a much faster development speed. 
You can also think of the “# letter as 4 “+ stack together, 
which is CH=: Although Unity is developed with CH; 
Unity users adapt C#as the programming language for 
game development. 


Python 


Python is a superstar in modern programming languages. 
Python focuses on the programming experience of 

the developers and lowers the bar of programming for 
everyone. Python has a clean and elegant coding syntax, 
and is moref exible in many details. There are many Game 
Engines that are developed with C++and designed to be 
used with python. 


Blueprint 


Blueprint is a visual scripting language developed by 

Epic Games to help with faster development. Blueprint 
uses nodes, and lines connect to themto program 

game logic. It is bound with C++-under the hood and 

can communicate with C--- seamlessly. Unreal Engine 
supports both C++and Blueprint; in most of the 

cases, Blueprint can be converted into C++to improve 
performance. The best practice to use Unreal Engine isto 
use both C++and Blueprint. However, to ease the learning 
curve, we are not going to touch a lot of C++and focus on 
Blueprint. 


Let's learn some basics of Blueprints through some UI 
work. 


Tutorial 13.1: Create an Ul 


Step 1: Create the UI Widget. Go to the Level folder 
in the Content Browser. Right click and select 
Level. Namethis new level StartMenul evel, and 
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double click on itto open it. The leva should 

be pitch-black. Go to the Blueprints folder, and 
create a new folder called WBP. WBP means 
widget Blueprint. A widget isa UI or a Ul element 
wecan put on the screen. Right dickin the 

WEP folder, and select User Interface ^ Widget 
Blueprint. Namethenew Widget Blueprint to 
WBP StartMenu. 

Step 2: Add a button. Doubleclick the WBP . 
StartMenu to open it with the Widget Editor. Go 
to the Palette panel at the upper left corner, and 
you can see some prebuilt Ul elements we can 
use. Drag a button to the canvasat the center of 
the window (Figure 13.1). 

Step 3: Drag a text to the button. In the Palette 
panel, f nd and drag Text to the button we 
created to add a text to the button. You should 
seethetext snapsto the button, and under 
theHierarchy panel, you can also seethat the 
text isinsidethe button. This Hierarchy isthe 
sameasthe Maya Outliner we arefamiliar with. 
Currently, thetext is parented under our button 
(Figure 13.2). 

Step 4: Namethe button and thetext. Right click 
on the Button 141 (yours could bea dif erent 
number) in the Hierarchy and select rename: 
renamethis button to StartButton. Click and 
drag the edge or comer of the button on the 
canvasto makeit bigger. Makesurethat the 
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text is not dipping out of the edge of the button. 
Click on the[Text] "Text Block" in the Hierarchy to 
select it. Go to the Details panel, and under the 
Content section, set the Text to Start Game. Press 
theSave button to savethe changes. 

Step 5: Bind the button dick. Select our StartButton 
in theHierarchy. Go to the Details panel, scroll 
down to the bottom, and f nd the Events 
section. Click on the plus button on the right 
sideof the On Clicked text. The UI changes 
to the Event Graph, with a nodenamed On 
Clicked (StartButton) highlighted in the middle 
(Figure 13.3). 


Event Graph 


The Event Graph is where we create our Blueprint code. 
Many assets have Event Graph that allows us to write code 
to that asset, and the navigation of the Event Graph is the 
same as the Material Editor. 


Step 6: Our f rst code. Right click anywhere in the 
Event Graph, search for Print String, and hit Enter 
to create a Print String node. Click and drag 
thetrianglepin of theOn Clicked (StartButton) 
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nodeto thetriangle pin on theleft of the Print 
String node (Figure 13.4). Pressthe Compile (we 
will explain what compile means soon) and 
Save button on the upper left comer to savethe 
changes. 
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Execution Pin and the 
Order of Execution 


The triangle pins we connect in Step 6 are called 
execution pins, and these pins show the f ow of the 
program. When we are programming, we write down a 
sequence of instructions to tell the computer what to do. 
The direction of the triangles and the lines connected to 
them shows the order of the instructions to execute, or we 
call the order of execution. In this case, the program f ows 
left to right. It can be read as: 


The button is dicked, then do Print String. 


The execution pin on the left side of the node is called in 
execution pin, and the execution pin on the right side of 
the node is called out execution pin. 


Step 7: Create leva GameMode. Create a new folder 
called GameModes in the Blueprints folder. 
Goto the World Settings pand, and under the 
Game Mode section, click on the "4" sign on 
theright of the GameMode Override setting. In 
the pop-up Create New GameMode window, 
navigate to the GameModesfolder, typein 
GM SrartMenuLevel in the Name setting, and 
press OK (Figure 13.5). 
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GameMode 


GameMode is part of the framework Unreal Engine 
adapts in the default setting. GameMode controls the 
major components of the game, like the number of 
players in the game, character the player is controlling, 
and the heads-up display (HUD). GameMode also 
controlsthe rules of the game, like the win-lose 
conditions, level transitioning. Unreal Engine has a 
complete and mature framework that is battle-tested 
by many games. We are going to stick with the Unreal 
Framework. However, you can program everything from 
scratch if you wish to. 


Step 8: Add our Ul to the viewport using GameMode. 
Go to the GameModes folder and double dick to 
open GM_ StartMenuLevel. Click the Event Graph 
tab abovethe viewport in the middleto switch 
to the Event Graph. Create a Create Widget 
node by right dicking and searching. Click on 
thedrop-down menu of the Class settings of 
the Create Widget node and set it to our WBP « 
StartMenu. Connect the execution pin fromthe 
Event BeginPlay to the input execution pin of the 
Create Widget node. 


Create a Get Player Controller node (again, just nght click 
and search). Connect the Return Value output pin of the 
Get Player Controller node to the Owning Player input pin 
of the Create Widget node. Create an Add to Viewport 
node and connect the out execution pin of the Create 
Widget node to the input execution pin of the Add to 
Viewport node. Connect the Return Value output pin of 
the Create Widget nodeto the Target input pin of the Add 
to Viewport node (Figure 13.6). 


Play the game now, and the Start Game button should 
appear in the viewport. Click on the button, and a hello 
get printed at the upper left corner of the screen. 


Tips and Tricks 


When we are trying to create a node, right dick in an 
empty area and start typing in the keywords to start 
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searching. The node may appear in the search before you 
type the full name, and you can use the up and down 
arrows to move in the list and pick the one you want. Press 
the Enter button to create it. 


Functions 


The Create Widget, Add to Viewport, and Get Player 
Controller nodes are all functions. Functions perform 
certain tasks and sometimes take inputs and spit out 
outputs. Functions can also be considered as reusable 
pieces of code that we can use multiple times. The inputs 
are called arguments of the function, and the outputs are 
called return values. In the realm of Blueprint, arguments 
are also called parameters. No matter what they are 
being called, they are information the function needs 

to perform its task. We call a function by connecting 

to the in execution pin of afunction. Functions do not 
run if there is nothing connected to their in execution 
pins. Most of the time, we call a sequence of functions 

to achieve acertain game logic, and the order of the 
execution is based on the f ow of the connections of the 
execution pins. 


The Create Widget is atypical function, and its function 
is to create an instance of a widget. The Create Widget 
function has two inputs: Class and Owning Player. The 
Class input determines what kind of widget to create, 
and the Onwing Player input determines which player 
owns the new widget. The Create Widget needs those 
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two inputs to know what to create and who takes the 
ownership. The Return value output is the new widget 
created. 


The Add to Viewport is also a function that adds a widget 
to the viewport. The Target input of this node determines 
which widget to add to the viewport. 


The Get Player Controller is a pure blueprint function. 

Pure Blueprint functions have no execution pins and will 
be run when some other function is taking their return 
values. Get Player Controller gives us the PlayerController, 
which isthe representation of the player. The Player Index 
input is set to 0, which means that we are getting player's 
PlayerController. 


Event BeginPlay is an event, and under the hood, an 
event is a simplif ed function. Events do not spit out 
outputs and support some other blueprint features that 
we are going to explore later. This Event BeginPlay will 
automatically run when the game starts. In the world of 
Unreal Engine, functions and events are interchangeable 
in most of the cases, and under the hood, they are the 
same thing in CH 


To translate this piece of code in English: 


When the game starts, create a WBP StartMenu for 
playerl and add it to player1's viewport. 


Machine Code, Source 
Code, and Compiling 


Computers are binary machines; internally, all 
instructions boil down to a sequence of Os and 1s. These 
O and 1 sequences are what we call machine code. The 
computer can understand and execute machine code, 
but it is not very easy to read by humans. It is even 

more painful to write machine code. Code written by 
programmers like the Blueprint code we are writing 

is called source code. Source code is the source of 
generating machine code. Source code is readable 

by humans, but the computer cannot understand it. 


The process of converting source code to machine code 
so the computer can understand it is compiling, and the 
tools to make the conversion are called compilers. When 
we are done with our coding, pressing the Compile 
button converts our Blueprint Code to machine code so 
it can run in our computer. 


Step 9: Makethe button load our Level O1_ 


Awaken: open the WBP  StartMenu and go to 
the Event Graph by clicking the Graph button 
at theupper right comer of the window. Delete 
the Print String node, create an Open Level 
node, and typein Level 01 Awaken in the 
Level Name. Connect the output execution 
pin of the On Click(StartButton) nodeto the 
input execution pin of the Open Level node 
(Figure 13.7). Run the game and pressthe 
button, then theLevel 01. Awaken is now open, 
and wecan start playing. 

So far, everything worksf ne, but there 
aretwo design f awsin our coding style. 

Problem 1: The UI should only bein charge 
of taking input from the player and not deal 
with direct tasks like opening a level. What if we 
have some conditions or rules that prevent the 
loading of another level? Likethe player is not 
f nished with all thetasks needed? Is UI going 
to handleall these? If we maketheUl handleall 
these, what if we wantto create a new UI? Do we 
haveto rewriteall thesein thenew UI? What we 
aredoing now islikeasking the receptionist of a 
company to do the manager'sjob. 

Problem 2: Wetyped in Level O1 Awaken 
in theLevel Nameof the Open Level function, 
so it is going to open Level Ol Awaken. There 
isnothing wrong here, but imaginethat you 
haveto load Level 01_ Awaken in other places 
also, then you need another Open Level with 
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Levd O1 Awakenin its Level Name. Then maybe 
you decided to renameLevel O1 Awaken to 
Level O1 Escape. Then you haveto f nd all the 
Open Level functions and changetheir Level 
Nameto Leve O1 Escape. It would beniceif we 
can change it in one place only. 

Questions like Problems 1 and 2 are related 
to what we call design pattems. You can code 
anything anywhere, but it is better to keep things 
organized, easyto understand, easyto make 
changes, and easyto communicate with other 
code. The process of adjusting and organizing 
thecodeiscalled refactoring. 

Let's refactor our structure here and 
leam some new concepts of Blueprint and 
programming in general. 





Tutorial 13.2: Refactoring 
Our Load Level Mechanic 


Step 1: Move Open Level function to the GameMode. 
Open our GM_StartMenuLeved and go to the 
Even Graph. Right click and search for custom 
event, and choosethe Add Custom Event to add 
a new custom event. A custom event is likea 
function that we can call somewhere else. Name 
this custom event to LoadTheFirstl evel (you 
can select it and press F2 to renameit). Create 
an Open Level Node, and connect the output 
execution pin fromthe LoadTheFirstLevel custom 
event to the input execution pin of the Open 
Level node (Figure 13.9). 

Step 2: Usea variableto represent the nameof the 
f rt leval. Goto the Variables section under 
the My Blueprint panel located at the bottom 
left comer of the window. Click on the "7 sign 
at the nght of the Variablelabe. A new item 
called NewVar. 0 got added to thelist under the 
variable section. This NewVar Oisa variable. 


© LoadTheFirstLevel — 


f Open Level 
> ———— p 
> Level Name [None] 


b 4 
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Variable 


Variables are containers that store data in them, and the 
data they store can be changed or used somewhere else. 
A variable has three essential aspects: 


1. The name of the variable. 
2. Variable type. It can be a number, a letter, or a custom 


type. 


3. Thevalue of the variable. Boolean 
, Byte 
Variables can be passed around, and any other part of the 
Integer 
code can use the values of the variables. 
= |nteger64 

Float 
Variable Types NENIE 
Variable types are strict in Blueprint and many other String 
programming languages. One type of variable should Text 
not be used as other types. Figure 13.9 shows the basic Vector 
variable types Blueprint has. Every type of these variables =æ Rotator 


has a color associated with them. You know that the two 
variables are the same type if they have the same color. 


Transform 


Let’s explain some of the essential variable types: AGLRE 139 heaidietypss 


Boolean Boolean has two possible values: true or 
false. It is primarily used for conditions to 











determine what to do. 

Integer Integer represents a whole number, a 
number that is not a fraction. 

Float Float represents a number with a decimal 
point. Or has fractions. 

String A sequence of letters. Can represent things 
like names, sentences, or passwords. 

Name Represents a name. Compared to string, 
name is a specialized type that only 
represents names. 

Vector Represent a collection of numbers. A 


translate of an object has three numbers: 
translateX, translateY, and translateZ. A 
vector can represent a translate but not 
limited to that. 
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We will explain other types in detail when we use them. 





For this NewVar O variable, we want to give it a name 
called FirstLevelName. With the NewVar O selected, 
go to the Details panel and set the Variable Name to 
FirstLevelName. 


The variable type of the variable should be Name 

because we are going to use it asthe input of the Open 
Level function. The Level Name input of the Open Level 
function is of the type Name. In the Details panel, click the 
drop-down menu of the Variable Type setting and select 
Name. 


The value of this variable should be Level O1 Awaken. To 
change the value, we haveto press the Compile button 

f rstto commit the changes we have made. After clicking 
the Compile button, go back to the Details panel and set 
the First Level Name under the Default Value section to 
Level 01 Awaken (Figure 13.10). 


Step 3: Useour variable asthe Open Level input. 
Drag the FirstLevelName variablefromthe 
Variablesto the Level Nameinput pin of the 
Open Level node (Figure 13.11). Press Compile 
and saveto commit the changes. 

Step 4: Makethe UI call theLoadTheFirstL evel 
event. Go back to the WBP StartMenu and 
deletethe Open Level node. Createa Get Game 
Modenodeand a Cast to GM_StartMenuLevel 
node. Connect the Retum Value of the Get 
Game Mode nodeto the Object input of the 
Cast to GM StartMenuLevel node. Drag the As 
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GM Start Menu Level output pin of the Cast to 
GM StrartMenuLevel nodeto an empty area. In 
the pop-up menu, search for Load the First Level 
and pressthe Enter button to createa call to 
the LoadTheFirstLevel event. The execution pins 
between the Cast To GM &artMenul evel and 
theLoad the First Level node gets automatically 
connected. The As GM Start Menu Level now 
feeds in the Target input of the Load the First 
Level node. Finally, don’t forget to connect the 
On Clicked(SrartButton) to the Cast to GM _ 
StartMenuLevel node (Figure 13.12). 
Thecodeherein plain English is: Get 
the GameMode this level is using and call 
its LoadTheFirstLevel event. Play thegame 
again, and you can seethe gamenow 
behavesthe sameas before. The Get Game 
Modefunction and Get Player Controller 
function are both pure blueprint functions. 


Tips and Tricks 


You may wonder what this Cast to GM StartMenuLevel is. 
It doestake much other knowledge about programming 
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to explain this function. We will cover it after we dip into a 
new concept called class in just a bit. 


Thefunctionality is not changed after our adjustment. 
However, this change is essential to make our code clean 
and manageable. With our FirstLevelName variable, we 
can use it anywhere we want. If the level name changes, 
we just need to change the variable. If there are other 
criteria to load thef rst level, we can add themto the 
LoadTheFirstLevel event. Anytime we need a new UI, or 
need to load the f rst level somewhere else, we can get 
the game mode and call its LoadTheFirstLevel event. What 
happens now with our receptionist and manager analogy 
earlier is: 


Thereceptionist is now asking the manager to do 
thejob requested. 


The steps we have gone through is a sneak peek of what 
a programming job is done. We f rst started with a simple 
approach to make the button load Level 01 Awaken. 
Then, we did some adjusting to make it better, a process 
we call refactoring. Often, it takes at least these two steps 
to f nish a program and sometimes many iterations of 
these two steps to bring the code to perfection. 


All the functions and events we have been calling are 
built-in functions of the Unreal Engine framework except 
the LoadTheFirstLevel event we implemented ourselves. 


Let's learn some more important concepts before moving 
on. 


There are two dif erent variable categories: built-in 
variable types and custom variable types. Both categories 
are used in the same way. Built-in variable types are what 
the programming language already have, and custom 
variable types are the types the programmers created for 
their particular project: 


Built-In Variable Types 


Boolean, Integer, and Float are examples of built-in 
variables types, and they are the essential data types 





that everyone needs to start programming. Most 
programming languages have them. 


Custom Variable Types 


The Name variable type is not a built-in variable type of 
the low-level language Unreal uses (C2). It is a custom 
variable type that Unreal developers created for Unreal 
Engine only. There are more custom variable types 

than built-in types. In fact, the BP ceiling light O1, BP_ 
ceiling light 02, and BP lights f oor light we created in 
Chapter 4 are all custom variable types we have created. 
You can even f nd them in the drop-down menu of the 
Variable Type settings (the setting we were tweaking 
when we create the FirstL evelName variable). Our new 
WBP StartMenu and GM StartMenuL evel are also custom 
variable types. 


Custom variable type also has an of cial name called class. 


Class 


Classis a feature designed to describe real-world 
objects, and they are also called custom variable types, 
as described above. In real life, there are many dif erent 
types of things, like animals, human beings, cars, and 
companies. It is possible to store data about these 

dif erent types of things in various variables of built-in 
variable types, consider these two essential aspects of a 
human being: 


Name 
Age 


Name can be represented with a variable of type string. 
Age can be represented with a variable type of integer. 

If there are two human beings in our game, one isthe 
player and the other isthe enemy, then we can create four 
variables to represent them: 


A string called PlayerNamewith a value "Hen." 
An integer called PlayerAge with a value 26. 
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A tring called EnemyName with a value "EvilBlen." 
An integer called EnemyAge with a value 26. 


Thislooks manageable. However, what if we have more 
things that we need to represent. It makes total sense to 
have hit points, move speed, skills, equipment, and other 
things we could need to describe our player and enemy 
or enemies. Let's say we have 1 player and 20 enemies, 
we need to keep records of their names, ages, hit points, 
speeds, skills, and equipment. There are six variables for 
each one of them, and there are 21 of them. So, we need 
21 times 6, which are 126 variables to represent all of 
them! It is a disaster to represent them with 126 variables 
forthe reasons listed below: 


l What if you forget to create one of the variables? 

2. What happens if one of the enemies got eliminated? 
Do you still keep these variables around? 

3. Ifthe player used some skillsto restore hit points, how 
do you prevent it from getting over the maximum 
allowed? You probably need a function to help with 
that just like the LoadTheFirstLevel function we create 
inthe GM StartMenuLevel. 


Thelist goes on and on, and it is just too messy to manage 
all the aspects of one object as separated variables of built-in 
variable types and also potentially functions. It would 

be nice if we can package all the variables and functions 
needed to represent the player or an enemy in one package. 


For the reasons listed above, class is invented to package 
variables and functions together to describe a new 
custom variable type. A class is essentially a collection 

of variables and functions that describes a new variable 
type that the program needs. We have created f ve classes 
already we created three lights in Chapter 4 (BP ceiling - 
light O1, BP ceiling light 02, BP lights f oor light), the 
GM StartMenuLevel, and the WBP StartMenu. These are 
all classes. We can examine their composition as variables 
and functions: 


Forthe three lights, every one of them consists of a static 
mesh and a certain type of light. The static mesh and the 





light are the variables of the light classes. The variable of a 
class is also called a member variable of that class. In this 
case, the variable type of the static mesh and the light are 
custom variable types that only Blueprint has. You can 
also consider static mesh, and lights are built-in types of 
Blueprint, but not built-in types of C: after all, they exist 
in Blueprint already. 


Forthe GM StartMenuLevel, we have a variable called 
FirstLevelName and an event called LoadTheFirstLevel. An 
event or function of the class is called a member function 
(again, you can think of events and functions are the same 
thing in Blueprint, they are the same in the C++level). 


For our WBP StarMenu, the button and the text are 
member variables, and the On Clicked(StartButton) is a 
member function. 


Onething that we need to be clear here isthat classes 
represent variable types and not actual variables. They are 
the blueprints of dif erent types of variables. J ust like in 
the real world, the word "human" is describing all human 
beings as atype of animal, but not one human. An actual 
human being is an instance of the human class. Similarly, 

a variable of a classis called an instance of that class. For 
example, the Firstl evelName variable we create for our 
game mode is an instance of the Name class. The variables 
of classes can also be called objects. 


With the basic concept of classes in mind, let's make 
another set of classes to future explore other features of 
classes. Play the game and click the start game button. The 
player should land in the start room. However, we cannot 
get out of the room because the door is locked. Let's make 
a Class that can describe an automatic sliding door. 


Tutorial 13.3: Make a 
Sliding Door Class 


Step 1: Createa Triggerable dass. Go backto the 
Levd O1 Awaken level, and create a new 
folder called Triggerables in the Blueprints 
folder. Right dick in the Triggerablesfolder, 
and select Blueprint Class; any dass wecreate 
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in the editor isa blueprint dass. In the Pick 
Parent Class pop-up window, click Actor. Anew 
blueprint is now added to the folder, rename it 
BP Triggerable (Figure 13.13). 


Parent Class 


When creating a class, we can choose to give it a parent 
class (or not to). A class with a parent class automatically 
has all the variables and functions of its parent, or in other 
words, they can do whatever their parent can do. 


A child class can be passed around and used as if it was its 
parent class, but not the other way around. For example, 
Suppose we have a Human class and we created a child 
class of Human class called Programmer. A Programmer is 
a human, but a human is not necessarily a programmer. 


All classes we have created have their parent class, 

and alot of the heavy lifting is done with their parent 
classes under the hood. Objects of the Actor class can be 
placed in the level, and ourtriggerable class needs that 
functionality; that is why we chose Actor as its parent 
class. Give a class a parent class is called inheriting, a class 
isthe child class of its parent class. 





Step 2: Add a trigger to the BP_Triggerable. Double 
click to open the BP_ Triggerable blueprint class. 
If you got a window like Figure 13.14, just click the 
Open Full Blueprint Editor to open it with the full 
editor. Click on the Add Component button at 
the upper left comer of the window. Typein box 
collison and press Enter to add a box collision 
component. Select the new component and 
press F2to renameit Trigger. 

Step 3: Add an on component begin overlap event. 
Select the Trigger, go to the Details panel, scroll 
down to the bottom, and f nd the Events section. 
Click on thegreen plus button on theright of the 
On Component Begin Overlap label. A new event 
called On Component Begin Overlap (Trigger) is 
created in the event graph (Figure 13.15). 
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Step 4: Add an on component end overlap event. 
Select the Trigger again and go to the Details 
pana; this time, click on the green plus button 
of On Component End Overlap. This creates 
another function called On Component End 
Overlap (Trigger). 

TheOn Component Begin Overlap 
(Trigger) event will becalled when some 
other actors start overlapping with it. The On 
Component End Overlap (Trigger) event will be 
called if other actors stop overlapping with it. 

Step 5: Create custom events. Right dick in theempty 
placeandtypein custom event, press Enter to 
createa customevent, and namethis new custom 
event Overlapped. With this custom event selected, 
go to the Details pana. Hover thecursor on the ^ 
ggn on thenght of thelabe of theInputs section, 
and dickto add a new parameter. Under the 
Inputs section, typein Other Actor asthe name 
of thenew parameter. Click on the Boolean to 
open thedrop-down list, search for Actor, and 
sdect Actor ^. Object Reference. This parameter 
isnow an input pin of thisnew Overlapped event, 
anditisoftheActor dass. Createa Print String 
node and connect theout execution pin of the 
Overlapped event to the in execution pin of the 
Print String node. Drag the Other Actor output of 
theOverlapped event to the ln String input pin of 
thePrint Sring node. Unreal creates a Get Display 
Namenode automatically in between to get the 
nameof theOther Actor input and passthat to the 
In String of the Print String node. Createanother 
custom event and call it UnOverlapped. Set the 
UnOverlapped event the same way wedid forthe 
Overlapped event (Figure 13.16). 
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Step 6: Add call to the custom events. Right click 
in the empty space, search, and create an 
Overlapped node and an UnOverlapped node. 
Thesetwo new nodes arefunction callsto the 
Overlapped and UnOverlapped events we create 
in Step 5. Connect the out execution pin of the 
On Component Begin Overlap (Trigger) to thein 
execution pin of the Overlapped node. Connect 
the Other Actor output pin of the On Component 
Begin Overlap (Trigger) to the Other Actor 
input pin of the Ovelapped node. Connect the 
On Component End Overlap (Trigger) and the 
UnOverlapped nodein the same way we connect 
theOn Component Begin Overlap (Trigger) node 
and the Ovedapped node (Figure 13.17). 


Go backto the Content Browser, and drag the 

BP Triggerableto the level to create an instance of 

BP Triggerable. Remember where it is, play the game, 

and walk over it. You can now seethat the name of the 
FirstPersonCharacter got printed out at the upper left comer 
of the Ul. The code we did translate into plain English is: 


When an actor overlaps and stops overlapping the 
trigger, print the name of that actor. 


Read the sentence carefully and you can see a potential 
problem here. Any actor can trigger it. However, we only 
want the player and the enemy to be able to trigger this. 
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Let’s solve this problem by checking the class type of the 
actor that triggered it. 


Step 7: Add checking to the class of the actor. Go to 
theFirstPersonBP/ Blueprints folder, and double 
click to open the FirstPersonCharacter class. Click 
on the Class Settings button, and you can f nd 
that the Parent Class of this FirstPersonCharacter 
is Character (Figure 13.18). 


Character 


A character can move around the level and can be 
possessed by the player or Al. For most of the time, we 
would use Character as the parent class for a player 
character or Al-controlled enemy. In this case, if we want 
to make sure that only the player or the enemy can trigger 
it, we just need to check if the overlapped actor's parent 
class is Character. 


Go back to the Event Graph of the BP Triggerable 

class, and drag the Other Actor output pin of the On 
Component Begin Overlap (Trigger) node out to an empty 
area. Release the mouse, and a list of actions we can do 

to this actor appears. Search for GetClass and hit Enter 

to create a GetClass function call. This function returns 
the class of the Other Actor. Drag out the Return value 
output pin and search for Class Is Child Of and hit Enter to 
create a Class Is Child Of function call. Set the parent class 
argument of the Class Is Child Of to Character. 





The pin of the Return Value of this Class Is Child Of 
function is red. A variable of red color is of type Boolean. 
A Boolean variable has two possible values: true or false. 
In this case, if the Test Class isthe Child of the Parent 
Class, the return value is true; otherwise, the return 
value is false. 


Hold down the B button and click anywhere to create a 
Branch node. Connect the Return Value of the Class Is 
Child Of to the Condition input pin of the Branch node. 
Connect the out execution pin of the On Component 
Begin Overlap (Trigger) to the in execution pin of the 
Branch node. This Branch node is not a function. It is a 

f ow control statement. If the Condition input istrue, the 
execution f ow continues after the True out execution pin. 
Otherwise, the f ow goes toward the False execution pin. 


Connect the True out execution pin of the Branch node to 
the in execution pin of the Overlapped node. 


This part of the code can now translate in plain English as: 


If the class of the Other Actor isthe child of the Character 
dass, then call the Overlapped function. 


Set up the same parent class checking in the On 
Component End Overlap (Trigger) (Figure 13.19). 


Play the game, and the behavior of the trigger should still 
work as expected. However, we now have the peace of 


f Class Is Child Of 


f Class Is Child Of 
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mind that only an object of the Character class or its child 
class can trigger it. 


Step 8: Createa sliding door class that inheritsthe 
BP Triggerable. Go back to the Triggerables 
folder, right dickontheBP Triggerable dass, 
and select Create Child Blueprint Class. Name 
thenew class BP_SlidingDoor. Doubleclick to 
open it. Under the Components panel, you can 
seethat thereis already a Trigger component, 
anditisInherited fromtheBP Triggerable 
dass. Components arethesame as member 
variables, and they are called components just 
to conceptually make more sense. Like what 
we have mentioned before, the child class 
automatically got (inherits) all the member 
variables and functions the parent class has. 

Step 9: Add the door meshes to the dass as static 
meshes. Go to the SaticMeshes/door folder in 
the Content Browser. Select the door door - 
frame, door. door I, and door door rmeshesin 
thefolder and drag themto the component list 
oftheBP SlidingDoorto add all three meshes as 
static mesh componentsto theBP SlidingDoor 
dass. You can now seethedoors in the viewport 
of thedass (Figure 13.20). 

Step 10: Add variablesto storethe door open 
position. Left click to select the left door in the 
viewport. Hit Wto switch to Moveand moveit 
to slideit open. Go to the Details panel, right 
dick on the Location label under thetransform 
section, and select Copy. Add a variable by 
pressing the “-F’ sign in the Variables section 
and namethe new variablel door open pos. 
Go backto the Details panel, and changethe 
Variable Typeto Vector. Pressthe Compile and 
Save button to commit all the changes. Go back 
the Details pana. Right dick on the L Door Open 
Poslabel under the Default Value section and 
select Paste. This! door open posvariablenow 
stores the open position of the left door. Create 
another vector variable called r_door_open_pos 
to storethe open position of the right door 
(Figure 13.21). Don't forget to movethe doors 
back afterward. 

Step 11: Createfunction overrides. A child class 
inherits all functions its parent has. So our 
BP SlidingDoor has the Overapped and 
UnOverlapped functionsthe BP Triggerable 
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dass has. However, we want dif erent behavior 
when wetriggered the door. A child class can 
overridea parent function to redef ne what 
thefunction does in the child class. Go to the 

My Blueprint panel, hoverthe cursor abovethe 
Functions label, and dick on the Override button. 
Select Overlapped in the drop-down list to create 
an overrideof the Overlapped function. An 

Event Overlapped node got created in the Event 
Graph. This Event Overlapped event looks likea 
regular custom event, but it is an overrideof the 
Overlapped event of the parent class. Go ahead 
and create an overrideto the UnOverlapped 
function as well (Figure 13.22). 

Step 12: Test our override events. Add two Print 
String nodes, call one of them with the Event 
Overlapped, and changethe In String to door 
overlapped. Call theother one with the Event 
UnOverlapped and changethe n String to door 
unoverlapped (Figure 13.23). Go to the Content 
Browser and drag the BP. SlidingDoorto the level 
and placeit sideto side with the BP Triggerable 
we placed earlier. Play the game, and you can 
see "door overlapped" got printed when you 
approach thedoor, and "FirstPersonCharacter" 
got printed when you approach the 
BP Triggerable. 
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Tips and Tricks 


Print String may not be very useful for creating gameplay. 
However, it is a fantastic testing tool; use it to print out 
information to verify if the code behaves as expected. 


As you can see, overriding a function inherited fromthe 
parent class completely redef nes what the function does 
in the child class. 


Why? 


So why do we go through the trouble of making a parent 
dass and a child class? Well, there could be other stuf 

in the game that can be triggered. Let's say we need to 
create an automatic light that can be triggered if the 
player gets close. If we don't have a parent class, we have 
to create everything from scratch, including the box 
collision component and the overlapping events. With the 
BP Triggerable parent class, we can just inherit from it and 
overwrite the Overlapped and UnOverlapped functions. 


Step 13: Createa timeline. Deletethetwo Print String 
nodes. Right dick and search for Add timeline 
and press Enter to create a timeline. Namethe 
timeline DoorOpenAmount and double dick to 
open it. There is currently nothing in thetimeline; 
dickthef rst button with a lowercase “f” and a 
“+' sign asitsicon to add af oat track. Thisf oat 
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track isthe sameasthe Graph Editor we have 
covered in our animation chapters, and weare 
now creating an animation curve. You can now 
typein DoorOpenAmount to renamethisf oat 
track and hit Enter to commit (Figure 13.24). 

Step 14: Add keysto the animation. Right dick 
anywherein thecoordinates and select Add Key 
to CurveFloat_1to adda keytotheanimation 
curve. Adiamond-shaped point got added to 
the animation curve, and this point is a new 
key. With the new key selected, set thetime and 
value at thetop of the graph to O and O. This 
new key now movesto the (0, 0) coordinate. 
Add another key and set itstimeand valueto 1 
and 1, respectively. Also, set the Length attribute 
of thef oattrackto 1 at thetop of the graph 
(Figure 13.25). You can usethe same way we 
navigatethe Event Graph to navigatethe graph 
of thetimeline. 

Step 15: Usethetimelineto drivethe door 
movement. Go backto the Event Graph, and 
createa Lerp (Vector) node by right clicking 
and searching. Connect the DoorOpenAmount 
output pin of the DoorOpenAmount timeline 
nodeto the Alpha input pin of the Lerp (Vector) 
node. Dragthel door open position from 
the Variables section in the My Blueprint 
panel to the B input pin of the Lerp (Vector) node. 
Keep the A input pin valuesasit is. 
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Drag thedoor door | static mesh 
component fromthe Components pand to 
the graph to createa reference for it. Drag 
out the Door Door L output pin and type 
SetRelativeLocation and hit Enter to createa 
SetRelativel ocation node. Connect the Retum 
Valueof theLerp (Vector) nodeto the New 
Location input pin of the S&Relativel ocation 
node. 

Finally, connect theout execution pin 
of the Event Overlapped nodeto the Play 
execution pin of the DoorOpenAmount 
timeline node. Connect the out execution 
pin of the Event UnOverlapped node 
to the Reverse execution pin of the 
DoorOpenAmount timeline node. Connect 
theUpdate out execution pin to thein 
execution pin of the SetRelativeLocation node 
(Figure 13.26). 


^ EventOverlapped C “© DoorOpenAmount 
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What wedid herecan translateto plain 
English as: 

When overlapped, play the animations 
in thetimelineand updatethe relative 
location of theleft door. Therelativelocation 
of thedoor is (0, 0, O) at the beginning of 
theanimation and becomes! door open 
position at the end of the animation. When 
someone stops overlapping, reserve the 
current animation. 


Why? 


Based on the animation curve we set up in the timeline, 
when started, the Door Open Amount output value of the 
timeline changes from Oto 1 gradually in 1 second. 


The value of the Door Open Amount feeds into the Alpha 

of the Lerp (Vector) node. For any type of lerp node, input 
A, input B, Alpha, and the Return Value fulf II the following 
equation: 


Retum Value- Ax (1— Alpha) + Bx Alpha 


Or in other words, the Retum Value of the Lerp node is 
the blend of the A and B input based on the Alpha input. 
Alpha is ranging from Oto 1. The closer the alpha value is 
to 1, the closer the Return Value isto the input B. 


Step 16: Set uptheright door. Set up the right 
doorthesame way we se up the left door. The 
dif erencethistimeisthe SetRelativeLocation 
node of the right door is after the 
SetRelativeLocation node of the left door. 
Theyarealso sharing the sametimeline node 
(Figure 13.27). 


Play the game, and when you walk toward the door, the 
door automatically opens. 


Step 17: Scalethetrigger box. Thetrigger box istoo 
small for our sliding door. Go to the viewport of 
theBP SlidingDoor Blueprint, select thetrigger, 
and scaleit up likein Figure 13.28. Go backto the 
level, and you should seetheBP SlidingDoor we 
placed in thelevel isalso updated with the bigger 
trigger box. 
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Play the gameagain, and you will notice 
that we still cannot go through the door 
event it opens as expected. This isdueto the 
collison setup of thedoor frame. 

Step 18: Check door frame collision. Go to the 
StaticMeshes/door folder and double dick to 
open the door door framestatic mesh. Click 
on the Collision button at the top of the Asset 
Editor and select Simple Collision. You can now 
seea green box shows up in the viewport. This 
green box isthe collision shape of this model 
(Figure 13.29). 
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Collision 


To simplify the calculation of the collision, Unreal Engine 
does not use the actual model to calculate collisions. 
When an asset is imported, Unreal Engine generates a 
convex primitive based on the shape of the model and 
uses it asthe shapeto calculate collisions. The green box 
we see isthe generated collision shape of the door frame. 


Step 19: Fixthe door frame collision. Click on any 
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edge of the green collision primitiveof the door 
frameto select it. Usethetranslation tools to 
scale and moverit, so it covers one side of the 
column. Hold down Alt and drag to create a copy 
of theprimitive and drag it to cover the other side 
of thecolumn. Drag out another copy and tweak 
itto makeit cover theupper beam of the door 
(Figure 13.30). 

Savethe asset and play the game again. This 
time, weshould beableto go through the door. 

Many beginner programmers may think 
that their job of creating a sliding door is done 
here, and it might be truein some situations. 
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However, remember the general process of 
programming we havetalked about? What is 
missing here? 

The answer hereis refactoring. 

Let'sopen BP Triggerableand go tothe 
Event Graph. The code seemsall good and 
pretty dean as well. But thereisan import 
part of the codethat has its purposeuntold. 
What doesthe GeClass and ClassIs Child Of 
function do for our game? Asthecreator of the 
code, wecan say with great certainty that this 
pieceof code ensures onlythe player and the 
enemycan trigger it. And theodds arehigh for 
another programmer to assumethe purpose 
of this pieceof codecorrectly. Thisistoo simple. 

However, even the simplest thing in the 
code could cause bugs that we cannot detect, 
and making the purpose of any piece of code 
dear is essential. Let's enhanceit by wrapping 
it with a function to makethe purpose dear. 


Step 20: Createa function to check if the other 


actor should activatethetrigger. Hover the 
cursor overthelabel of the Functions section 
underthe My Blueprint panel. Click on the 
Function button to createa new function. Type 
in ShouldTriggerReactToActor asthe name of the 
new function. Anew tag got added to the right 
of the EventGraph tab, and it is now highlighted. 
Wearenow in thebody of thefunction 

(Figure 13.31). 


Step 21: Add input and output. J ust like how we add 


input to our Overlapped and UnOverlapped 
event, wecan add input to our function. Again, 
functions and events arethe same. Go to the 
Inputs section of the details panel, pressthe 
"-* sgn to add a new input, and set its name 
to ActorToCheck and itstypeto Actor. Add an 
output and nameit ShouldReact, and changeits 
typeto Boolean (Figure 13.32). 

If weadd outputsto a function, a Retum 
Nodeisadded with the outputs as its input 
pinsfor usto specify the value of the outputs. 


521 





CGeetingGareswithUred Engine Suostene Parte; &lVaya 


U (erum 
File Edit Asset View Debug Window Help Actor 
-*- Components ¥ Toolbar 2» Details 

^ 5 
"*Addcomponent- ix | | qi | Ele- 
€ BP Triggerable(self) & és he p 2 
-'Iigge ' Compile Save Browse Find Hide Unrelated S 
4@ DefaultSceneRoot 


e E" Viewport f Construction Scri m= Event Graph 
J Trigger 


ww» f > 


B My Blueprint 
POTENT Seach OE Drag Off Pins to Create/Connect New Nod 


4Graphs + 
> == EventGraph 4 Inputs + 


4Functions Override v Fusion} Please press the +i 


œf ConstructionScript at —À 
xm fw Should Trigger React to Actor MODUS + 


` = : Please press the * i 
Macros + D 

4Variables + 

> Components 


Event Dispatchers + 


Local Variables + 


EM Compiler Results & Find Results 


AGRE 1331 Getearavfudin 


` = Should I rigger Heact tc 
BE Viewport f Construction m= Event Graph f Should Trigg 


xd >| f > 
Description 
k Category 
Drag Off Pins to Create/Connect AN Keywords 
Compact Node Title 
Access Specifier 
Pure 


Call In Editor 


4 Inputs 4 


à ee oe a = —— 
Should Trigger React to Actor Return Node 
" m = F sctorrocneck — QActor "DEA v ES 


Ld & 
4 Outputs + 


Aw x 


Actor to Check Should React Q 





AGRE B? Adinotadainttothefintin 


Wenow havetwo nodesin the Function. The 
Should Trigger React to Actor node isthe 
beginning of the function, and the Retum 
Node isthe end of thefunction. Whatever we 
put in between thesetwo nodes arethe body 
of thefunction and will berun based on the 
order of execution. 
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Step 22: Implement our function. Create a GetClass 
nodeand a Class Is Child Of node. Connect the 
Actor to Check output pin of the Should Trigger 
React to Actor to the Object input pin of the 
GetClass node. Connect the Retum Value of the 
GetClass node to the Test Class input of the Class 
IsChild Of node. Connect the Retum Value of 
the Class Is Child Of to the Should React input of 
the Retum Node. Set the Parent Class parameter 
of the Gass Is Child Of nodeto Character 
(Figure 13.33). 

Step 23: Use the Function. Click on the Event 
Graph tab to go back to the Event Graph. For 
the On Component Begin Overlap (Trigger), 
delete the GetClass and Class Is Child Of 
nodes and create a Should Trigger React to 
Actor node by right clicking and searching. 
Connect the out execution pin of the On 
Component Begin Overlap (Trigger) to the in 
execution pin of the Should Trigger React to 
Actor node. Connect the Other Actor output 
pin of the On Component Begin Overlap 
(Trigger) to the Actor to Check input pin of the 
Should Trigger React To Actor node. Connect 
the out execution pin of the Should Trigger 
React to Actor nodeto the in execution pin of 
the Branch node. Finally, connect the Should 
React output pin of the Should Trigger React 
to Actor nodeto the Condition of the Branch 
node. Do the samething to the On Component 
End Overlap (Trigger). Figure 13.34 shows 
the result. 

Play the game again, and the behavior of 
the door should remain the same. Thereare 
two major improvements here: 


1. The Should Trigger React to Actor is self- 
explanatory. The purpose is very clear. 


fe Should Trigger React to Actor 
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2. Ifweneed to change the criteria, we just need to 
change the body of the function. And both events 
should work right away. 


Tips and Tricks 


Functions are our friends. Whenever you need to write 
down the same kind of code multiple times, you should 
create a function for it. 


Step 24: Replaceall other doors. Wehave 
successfully created a working sliding door. Go 
ahead and replaceall thedoors in thelevel, and 
now you can enjoy walking around the whole 
environment. 

Let'stryto give you a glimpse of one 
moreimportant concept before moving on to 
thenext chapter. 


Casting 


Remember the Cast To GM StartMenuL evel function we 
used earlier in the UI but did not explain? Let'stry to make 
sense of it now. First of all, our GM StartMenuLevel isa 
child class of another class called GameModeBase Class, 
and this class isthe default game mode used if we do not 
override one. The GetGameMode function only retums 

an instance of the type GameModeBase. The engine 





has no idea what child class of GameModeBase you will 
create to be your game mode to use in the level, so the 
GetGameMode only retums a GameModeBase. 


Remember we have talked about a child class can be 
used and passed around as if it was its parent? Here is 
exactly what's happening. The Return value is actually a 
GM StartMenuLevel, but it is taking a form of its parent 
type. However, we need to cast it to GM StartMenuL evel 
to use its LoadFirstLevel function. The Cast To GM _ 
StartMenuLevel does precisely that. 


Casting is very f exible, you can try to cast anything to 
anything. As long asthe data structure matches the 

type you are trying to cast to, but it may fail if the data 
structure is not compatible. Casting a string to an integer 
could fail, for example. You do not want to cast unrelated 
types because the result might be unpredicted. 


Conclusion 


We have covered functions, events, variables, and classes 
to some extent. We have used some useful blueprint 
classes like GameMode, Character, Actor, and Widget. 
However, we have barely touched the surface. Keep in 
mind that learning programming is a daunting process. 
To understand one concept, you may have to understand 
many others. Consider this: 


A function object is any object for which the function call 
operator is def ned. 


This description is fromthe cppreference.com, one of 

the online documentation of C++ To understand what 
this function object is, you have to understand what 
afunction is. You also have to understand what are 
operators and what is a function operator. Worst of all, 
what does "the operator is def ned" even mean. You could 
almost feel like you are reading an alien language. 


It is ubiquitous for beginners to encounter this kind 
of description, which renders them frustrated. Our 
suggestion is to have the mindset of accepting 
your ignorance and carry on with the leaming. 
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Try to understand as much as you can and don't get 
too carried away by one or two tricky concepts. You 
will understand more in the future if you don't give up 
leaming. 


Remember, the best way to improve your programming is 
to practice with it. 


We are going to explore the Unreal Engine framework and 
set up our player character in the next chapter. 








The player character is one of the essential parts of the 
game. So far, we are using af rst-person shooter template 
so we can explore our scene while building it, but now, it 
is time to create a player character of our own. After all, we 
Spent much time making our Character. 


Unreal Engine provides a set of classes to help create 
player characters fast. The Engine provides a robust 
framework that allows us to organize classes and data. 
We are going to cover many aspects of this framework 
and built our system on top of it. Although it is possible 
to build everything from scratch, it is going to be time- 
consuming. There is little to none merit to reinvent the 
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wheel unless you want to practice; with the length budget 
of this book, we will opt to use the prebuilt systems 
whenever it is possible. 


Tutorial 14.1: Create the 
First-Person Shooter Character 


Step 1: Create a base class for all characters. Go 
to the Characters folder, right click, and select 
Blueprint Class. In the pop-up Pick Parent 
Class window, select Character. Namethenew 
Character BP Character. Base. Double click 
to open BP Character Base Select the Mesh 
component in the Components pane. Go to the 
Details panel, and se the Skeletal Mesh to Hlen _ 
Skeletal Mesh. The body of Alen now appears 
in the viewport. Moveher down, so the feet are 
on the ground and rotate her —90 degrees to 
makeherfacethe direction of the blue arrow 
(Figure 14.1). Pressthe Compile and the Save 
button to commit the changes. 

Step 2: Createthe FPS character. Right click on 
BP Character Base select Create Child Blueprint 
Class, namethe new child class BP Hlen FPS, 
and open it. Changethe Skeletal Mesh of the 
Mesh component to Hlen FPS Skeletal Mesh. 
Press Compile and Saveto commit the change. 

Step 3: Makethe game mode. Co to Blueprints/ 
Gamemodes. Right click in the empty area of 
thefolder, and select Blueprint Class. In the 
pop-up Pick Parent Class window, select Game 


-$. Component 
+AddComponent~ (ive) 
Lu 


f 
# 8P_Character_Base(self) 
7. 
4 § CapsuleComponent (Inhe 
A, ArrowComponent (Ink 
My Blueprint asset here to add a c 
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Mode Base. Renamethe Game Mode Baseto 
GM Hlen FPS, and doubleclick to open it. 
Set the Default Pawn Classto BP Hlen FPS 
(Figure 14.2). 


Pawn and Character 


Pawn isthe parent class of Character. 


We have mentioned the Character class in Chapter 13. 

A character can be possessed (controlled) by the player 
or Al. It has a skeletal mesh component to represent it 
visually and can move like a human. Character is the 
parent class of the FirstPersonCharacter—the mechanic 
arm holding a gun that we possess when we hit the play 
button. 


Just like characters, pawns can also be possessed, but a 
pawn does not have a mesh component, and it cannot 
move out of the box. We usethe pawn class when we 
want something simpler than a human. The Default Pawn 
Class of the game mode determines the class of the Pawn 
the players are going to possess when the game starts. In 
our case, we want it to be our BP Ellen FPS. 


We can use our BP Ellen FPSasthe Default Pawn Class 
because it is a child class or Character, and Character is a 
child class of Pawn. Any child class can be used as if it was 
its parent class. 
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Step 4: Set the default game mode. Go to Edit ^ 
Project Settings. Click on the Maps & Modes 
section in thelist on theleft sde of the pop-up 
Project Settings window. Change the Default 
GameModeto GM_Hlen_FPS (Figure 14.3). 

Play the game and we can seethat weare 
no longer controlling the mechanic arms that 
hold a gun. Instead, we cannot see our body and 
cannot move. 

You can press the F8 button on the keyboard 
to unpossess our Character. F8triggers a 
debugging feature of Unreal Enginethat allows 
you to unpossess your current Character and 
navigatethe world the same way you do when 
editing thelevel. Move away and look back, and 
wecan seethe FPS body of Ellen, which means 
that wehave successfully switched out the player 
character. 

Any level that does not override its game 
modeis going to usethe default game mode 
def ned in the Project Settings window. If you 
recall, wehaveoverridden the game mode of 
StartMenuLevel by going to the World Settings 
and set the GameMode Overrideto GM _ 
StartMenuLevel. The tartMenuLeve still usesthe 
GM StartMenuLevel as its game mode. 

Step 5: Set up a camera. We can add a camera as 
the eye of the player to the Character. Open 
BP Hlen FPS, click the Add Component button, 
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search for camera, and press Enter to createa 
camera. Renamethe camera PlayerEye. Go to 
the Viewport of the Blueprint Editor and you can 
seea camera got added. Select the camera and 
moveit up, so it sits abovethe neck (Figure 14.4). 

Playthegame, and now we see through 
the PlayerEye camera. You can verify that by 
moving the camera back a littleso it can seethe 
body. Playthe game again, and you should see 
the body. Don't forget to movethe camera back 
after testing. 

Unreal f nds a camera component asthe 
viewpoint of the player if the Auto Active checker 
box of thecamera in the Details panel ison, 
which isthe default setting for a new camera. 

If thereis no camera component, Unreal setsthe 
viewpoint at the height def ned by the Base Eye 
Height member vanable of the Pawn. 

Step 6: Check the input settings. Go to Edit > Project 
Settings. In the Project Settings window, click 
the Input section. Under the Bind section of 
the Input section, you can seetwo categories 
of input binding: Action Mappings and Axis 
Mappings. Clickthesmall triangle buttons on the 
left of thelabelsof thecategoriesto open them. 
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Wecan seethat someinputs arealready def ned. 
Open thef rst one called J ump, and you can see 
a list of keys and controllers that are bond with 

it (Figure 14.5). These key bindings are fromthe 
template. 

For the] ump key binding, you can see not 
only Space Bar in thelist but also Gamepad, 
Vive, Daydream, Oculus Go, and many other 
devicesin thelist. This] ump key binding receives 
inputs from all these dif erent devices. Whenever 
the spacebar is pressed, or any triggers of these 
various devicesin the list are used, a global event 
called InputAction J ump will betriggered. Notice 
that you can changethe nameof this] ump key 
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binding, which means that the name of the event 
isall arbitrary. 


Step 7: Implement the jump event. Go back to BP 


Hlen FPSand switch to the Event Graph. Right 
click in an empty area and typein input jump, 
and press Enter to create an InputAction J ump 
event. Drag out fromthe Pressed out execution 
pin of theInputAction J ump event, search, and 
create a J ump function call. Press Compile and 
Saveto commit the change (Figure 14.6). 

Play the game again and press the spacebar, 
and you can already jump. 

Because jumping is such a standard 
action in an ordinary game, Unreal Engine 
has implemented it for us already. The) ump 
function isa function of the Character dass that 
makes the character jump. When the spacebar is 
pressed, it triggers this InputAction J ump event, 
which callstheJ ump function in our setup. 

Thereisa MoveForward key binding in the 
Axis Mappings category, open it, and you can 
see even more keys are bond with it. W and Sare 
among the keys, and pressing themtriggersthe 
InputAxis MoveForward event. 


Step 8: Implement the MoveForward event. Go 


to the Event Graph of BP Elen FPS. Create 

an InputAxis MoveForward event and an Add 
Movement Input function call. Connect theout 
execution pin of the InputAxis MoveForward 
event to thein execution pin of the Add 
Movement Input node. Connect the Axis Value 
of theInputAxis MoveForward event to the Scale 
Value of the Add Movement Input node. Because 
wearetrying to moveforward, the World 
Direction input should betheforward direction 
of the Character. Search and create a Get Actor 
Forward Vector node. Connect the Retum Value 
of the Get Actor Forward Vector nodeto the 
World Direction of the Add Movement Input 
node (Figure 14.7). 
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Press Compile and Save. Play the game 
and press the W button to move forward and 
Sto move backward. The Add Movement 
Input function is a function of the Character 
dass Unreal already implemented for usthat 
movesthe Character in the World Direction 
you specif ed. The Get Actor Forward Vector 
gives ustheforward direction of the Character. 
Character isa child class of Pawn, and Pawn 
isa child dass of Actor; this Get Actor Forward 
Vector function is a member function of the 
Actor dass. 


Why? 


Why the S button allows usto move backward? Look 
closer to the MoveForward key binding in the Project 
Settings, and you can see that the S button has a Scale 
value of -1. This Scale value is the Axis Value output of 
the InputAxis MoveForward event. When you press the W 
button, the Axis Value is 1; when you pressthe S button, 
the Axis Value is -L. When you hold down the S button, 

a value of -1 one is passed to the Scale Value of the Add 
Movement Input function, which causes the Character to 
move forward by -1 (move backward). 


You can try the up and down arrows on the keyboard to 
move forward and backward because they are also in the 
list of the keys that bond with the InputAxis MoveForward 
event. You can add new keys to the list by pressing the “+” 
button on the right of the MoveForward text f eld, or you 
can press the "X" button to delete a key binding in the list 
orthe entire key binding. To add a new keybinding to the 





Mappings, just click on the “+’ button on the right of the 
Mappings label. 


The Action Mapping istriggered once per button press 
or release. Axis Mappings are always in action or being 
triggered, or they are triggered every time the game 
updates. When no button is down, the Axis value is O. 
When a button is down, the Axis value isthe Scale value 
of that button. Notice that the Gamepad Thumbstick can 
give you a Scale value anywhere from -1 to 1 because 
you can push or pull the stick to the extreme or halfway 
through. 


Step 9: Implement the MoveRight event. Using a 
similar setup, wecan quickly implement the 
InputAxis MoveRight event. The dif erence 
hereisthat weareusing the Get Actor Right 
Vector instead of the Get Actor Forward Vector 
(Figure 14.8). 

Step 10: Implement the Tum event. Thereisa Tum 
binding in the Axis Mappingslist. Open it, and 
you can seethat the Mouse X is bond with it. 
Mouse Xistheleft and right movement of the 
mouse (Y is up and down). Go to the Event Graph 
ofBP EHlen FPSandcreatean InputAxis Tum 
event and an Add Controller Yaw Input node. 
Connect the out execution pin of the InputAxis 
Tum event to the Add Controller Yaw Input node. 
Connect the Axis Value of the InputAxis Tum 
event to the Val input of the Add Controller Yaw 
Input node (Figure 14.9). 

Playthegame again, and now you can look 
left and right by moving the mouse left and right. 
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Roll, Yaw, Pitch 


You can think of Roll, Yaw, Pitch as dif erent names for 
local rotation x, y, and z. Roll means rotating around the 
forward axis of an object, Yaw means rotating around the 
Up axis of an object, and pitch is rotating around the nght 
axis of an object. Orin other words, doing roll isto tilt your 
head left and right, doing yaw is to swing your head like 
you are saying no, and doing pitch is nodding your head 
up and down like you are saying yes. 


Controller 


You may not notice this, but the naming of this Add 
Controller Yaw Input function is a bit strange, why is 

it called Add Controller Yaw Input instead of Add Yaw 
Input? Well, because it adds input to the controller of the 
Character instead of the Character itself. Controller is a 
class, and a controller can possess a character. There are 
two child classes of Controller in Unreal Engine: 


PlayerController 


When a player joins the game, the game mode creates 
an instance of the controller class specif ed in the 
Player Controller Class member vanable in the game 
mode. This PlayerContoller is the representation of 

the player. As long as the player stays in the game, the 
PlayerController remains in the game as well. On the 
other hand, the Character the player possesses through 





the PlayerController might die, or the player might need 
to switch to a dif erent Character. In all these two cases, 
the PlayerController does not change, and the only thing 
changed here is the Character being possessed. 


AlController 


AlControllers can possess any character, just like 
PlayerControllers can. The dif erence here is that the 
AlController does not represent a human player, and it is 
an Al or a bot if you will. 


Step 11: Implement the LookUp event. Use an Add 
Controller Pitch Input to implement the InputAxis 
LookUp event (Figure 14.10). 

Playthegame again; but thistime, you 
cannot look up or down as you would expect. 
Inthe default settings, the Character usesthe 
controller's yaw input, but not the pitch input. 
Click on the Cass Defaults button and go to the 
Details pane. You can seethat the Use Controller 
Rotation Yaw is checked, but the Use Controller 
Rotation Pitch isnot (Figure 14.11). 

It makes senseto tum the whole body left 
and right, but not tilt it up or down, when isthe 
last time you tilt your whole body like Michael 
Jackson's incredible 45-degree lean? 

If wewant to look up or down, it's better to 
pitch the camera instead of the whole Character. 

Step 12: Makethe PlayerEye camera following the 
controller's pitch input. Select Player&yein the 
Components panel. Go to the Details pane, and 
under the Camera Options section, check on the 
Use Pawn Control Rotation option (Figure 14.12). 
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Playthegame again, and now we can look 
up and down by moving the mouse. If you look 
down, you can even seethe body. 

Because we are doing an FPS game, wedo 
not want to seethe body of the Character. The 
simplest approach hereisto makethe Mesh 
follow thecamera. 

Step 13: Makethe mesh of the body follow 
PlayerBye. In the Event Graph of BP Hlen FPS, 
you can alsof nd the Event BeginPlay event. It 
isalready calling another event named Parent: 
BeginPlay. This Event BeginPlay isan override 
of the Event BeginPlay of the parent class 
(BP Character Base). The Parent: BeginPlay isa 
function call to the Event BeginPlay of the parent. 
What is happening here can betranslated in 
plain English as: 

When the game starts, do whatever the parent 
dass doesin its Event BeginPlay f rst. 





By adding this Parent: BeginPlay, we are 
saying that we do not want to ignore what's 
happening entirely in the parent class. We do 
whatever the parent doesf rst, and then we 
can add new stuf afterward. You can add a 
function call to the overridden function of the 
parent class in any function you overridein the 
child dass. 

Drag out fromthe out execution pin 
of the Parent: BeginPlay node; search for 
AttachToComponent; and in the search 
result, select AttachToComponent (Mesh). An 
AttachToComponent node got created with the 
Mesh component automatically connected as 
the Target. Drag PlayerEyefromthe Components 
panel directlyto the Parent input pin of the 
AttachToComponent node. Set the Location, 
Rotation, and Scale Ruleto Keep World so that 
when attaching, the body does not snap to the 
camera's location, but it still follows with the 
of set they have. 

What we added here can betranslated to 
plain English as: 

When the game starts, attach the mesh of the 
body to the camera. 
Play the gameagain, look down, and you can no 
longer see the body because it is now following 
thecamera. However, if you walk below some 
light and look down, you can still seethe shadow 
of the body, and wedo not wish to seethe 
shadow becauseit is not a full body after all. 
Select Mesh in the Components pane, and go 
to the Details panel. Check of the Cast Shadow 
option under the Lighting section to disablethe 
Shadow of the mesh of the body. 

We have now successfully created the 
essential movement control of BP Hlen FPS. 
Butthereis no animation yet. Let's moveon to 
set uptheanimations. 


Tutorial 14.2: Set Up 
the Animation 


Step 1: Create the Animation Blueprint. Go to 
the Content Browser, and navigateto 
Blueprints/Characters/ Hlen/Animations 
folder. Right click and select Animation > 
Animation Blueprint. In the pop-up 
Create Animation Blueprint window, 


AL Create Animation Blueprint 


Parent Class: 
SA Animinstance 
BA AnimSharingAdditivelnstance 
SA AnimSharingStateinstance 
BA AnimSharingTransitioninstance 
O FirstPerson_AnimBP 
O TutorialAnimationBlueprint 
O TutorialTPP_AnimBlueprint 
MÀ VehicleAniminstance 


8 items «€» View Options v 


Target Skeleton: 


Search Assets ppi 


( None) 


+t Ellen_Skeletal_Mesh_Skeleton Skeleton 
bes] M Mi - el 


2] 


[à SK Mannequin Arms. Skeleton Skeleton 


3 items (1 selected) «€» View Options v 





AGRE 1413 Gedeanewv/XinatiaBugrirt. 


select Hlen Skeletal Mesh Skeleton asthe 
Target Skeleton and click OK. Namethe new 
asset AnimBP_Hlen (Figure 14.13). 


Animation Blueprint 


Animation Blueprint is a special type of class that controls 
the animations of a pawn. It has two major components: 


Event Graph 


The event graph of an Animation Blueprint isthe same as 
other blueprint, and you can program anything here. 





Animation Graph 


The Animation Graph controls what kind of animation is 
playing. 


Let's set up a basic idle-walk animation. 


Step 2: Gather the moving information in the Event 
Graph. Double click to open AnimBP_Hlen and 
go to the Event Graph. You can seethat two 
nodes are already in there. The Event Blueprint 
Update Animation is called every timethe game 
updates. The Retum Value of the Try Get Pawn 
Owner isthe Pawn that uses this blueprint. Drag 
out fromthe Retum Value, search, and createa 
Get Velocity node. The Get Velocity retums a data 
typeof vector. 


Vector 


We have been using vectors for a while now, and the 
Location, Rotation, and Scale value of an object are all 
vector data types. A vector is a collection of f oat values. 

It can represent a location, a rotation, a scale, or anything 
that needs multiple f oat numbers to represent it. In this 
case, it represents the velocity which isthe speed on the 
X, Y, and Z-directions of the Pawn that uses this Animation 
Blueprint. 


The Vector class in blueprint has three f oat member 
variables: X, Y, and Z. Vector can also be viewed as an 
arrow that has a direction and a length. If we put the 
start of the arrow at the origin, thetip of the arrow sits 
at the coordinates of X, Y, and Z. The length of the arrow 
is the distance from the origin to coordinates X, Y, and Z 
(Figure 14.14). 


We want to check if the player is moving or not. When it 
comesto velocity, the length of the vector determines the 
speed. Drag out fromthe Return Value of the Get Velocity 
node, search, and create a Vector Length node. Drag out 
fromthe Return Value of the Vector Length node and type 
in "— and select the f oat >f oat option in the list to create 
a new comparison node. This comparison node retums 
true if thef rst input is bigger than the second input. 
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What we are checking here is if the length (the speed) of 
the velocity of the Pawn is bigger than 0. 


Drag out from the output pin of the comparison node, 
and click the promote to variable option right below the 
search bar. Unreal automatically added a variable to the 
Blueprint class with the data type of the pin you dragged 
out (bool in this case) and created a set node to set the 
value of the new variable. Go to the Details panel and 
change the Variable name to isMoving. 


Connect the out execution pin of the Event Blueprint 
Update Animation to the input execution pin of the Set 
node (Figure 14.15). 


Step 3: Set up idle and walk variables. Go to the 
lower left comer of the window and you can f nd 
theisMoving variable added in the variables 
section. Add two more variables there (by 
clicking the "4" button), and changethe variable 
typeto Anim Sequence Object Referencein the 
Details pane. Compile and savethe blueprint. 
Select theldleAnimin the Variables section, go 
to the Details panel, and set the Default Value 


o Event Blueprint Update Animation 


È 
Delta Time X 


J Try Get Pawn Owner J Get Velocity 


Target | s elf | Return Value Target 
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to Hlen FPS Gun Idle SettheWalkAnimto 
Hlen FPS Gun Walk (Figure 14.16). 

Step 4: Test animation in the AnimGraph. Go to the 
MyBlueprint panel at the lower left comer and 
f ndtheAnimation Graphs section. Double dick 
theAnimGraph to open it. This AnimGraph isthe 
place wedef ne what animation to play forthe 
Character who usesthis animation blueprint. 
For now, thereis only an Output Pose node. 
Whateverthat is connected to the Result of this 
Output Pose node becomesthef nal animation. 

TheResult input pin with a small human 
f gureisan animation posepin. We aregoing to 
call this kind of pin posepin. 

Right click in the empty place and type play, 
and scroll upto thetop of thesearch list. You can 
seeall our animations here, and choose any one 
of themto createa Play Animation Sequence 
node. Its name may say play some animation. 
Select this new node and go to the Details panel. 
Check on the checker box after the Sequence 
label to exposethe sequence being played asan 
input pin. Drag our IdleAnimfromthe Variables 
to theSequenceinput pin of the Play node. Drag 
theout posepin of the Play Animation Sequence 
nodeto the Result in pose pin of the Output 
Posenode. Pressthe Compile and Save button, 
and now you can seethat the Character in the 
viewport at theupper right comer is now playing 
theldleanimation (Figure 14.17). 

Thef guremay appearto bethefull body 
or our FPS body, and it really does not matter 
becausethey sharethe same skeleton. You can 
change it by clicking the Preview Mesh button 
in thetoolbar abovethe viewport and select the 
other one (Figure 14.17 also shows wherethis 
button is). 

Step 5: Set up a state machine for the idleand walk 
animation. Deletethetwo nodes wecreatein 
Step 4. Right dick in the space and type Add 
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New State Machineto create a state machine 
node. Select this New State Machine nodein the 
Details panel, and changethe Nameto IdleWalk. 
Connect the out pose pin of theldleWalkto the 
Result of the Output Pose node (Figure 14.18). 


State Machine 


When playing agame, your Character is going to enter 

dif erent states like idling, walking, and shooting. A state 
machine allows you to def ne dif erent states and the rules 
to transition between dif erent states. Let’s see how it 
works for our animation right away. 





Double click to open the IdleWalk state machine. Drag out 
fromthe pin of the Entry node and select Add State.... 
This creates a new state. Select it and press F2 to rename 
it. Let's call it Idle. There is a gray outer rim on every state 
node. Drag out fromthe rim of the Idle state and select 
Add State... again to add another state. Name the new 
state Walk. Drag from the Walk state and drop the arrow 
to the rim of the Idle state to create another arrow back to 
the Idle state (Figure 14.19). 


The arrows connected between the states are called 
transitions. The direction of the arrow def nesthe direction 
of thetransition. For now, you can see atransition going 
fromthe Idle state to the Walk state and another transition 
going fromthe Walk state to the Idle state. 


Every transition has a ruleto decide if the transition 
should happen. Double click the circle icon with back 
and forth arrows of the transition from the Idle state to 
the Welk state to open its rule graph. You can see a Result 


Enty D => 


Add State... 
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Entry B» 
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node with a Can Enter Transition input pin in the graph. 
The color of the input pin is red, which means that it is of 
the type bool. When the input becomes true, then the 
transition starts to happen. Drag the isMoving variable to 
the Can Enter Transition input pin of the Result node. 





We want the transition from Idle to walk to happen when 
the player starts moving. Luckily, we have that information 
already. In Step 2, we have created a variable called 
isMoving, and it indicates if the player is moving. Drag the 
isMoving variable to the Can Enter Transition input pin to 
make a connection (Figure 14.20). 


To translate what we have done here in English is: 


When the player starts to move, transition the state 
fromthe ldlestate to the Walk state. 


Right at the top of the graph, there is a navigation bar. 
It’s like a folder structure that shows where you are in the 
hierarchy of the whole animation graph (Figure 14.21). 


Click the IdleWalk to go back out to the IdleWalk state 
machine with our two states and the transitions. Let's go 
into the rule graph of the transition from Walk to Idle and 
set it up. 


For the transition from the Walk state to the Idle state, we 
want the opposite rule. We can hold down Ctrl and drag 
the isMoving variable to the graph to create a reference 
for it. Drag out fromthe Is Moving node and create a 


© 


Result 


Is Moving ~ = 
x J Can Enter Transition 
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NOT Boolean node. Connect the NOT node to the Result 
(Figure 14.22). 


The NOT node is self-explanatory, and it f ips the value 
of the input as its output. What we did here can be 
translated to English as: 


When the player is not moving, transition back to the 
Idle state. 


Step 6: Def nethe states. Double click to open the 
Idle state. You can see an Output Animation 
Posenodein thegraph, whatever connects to 
it becomes the animation for this Idle state. 
Repeat what wedid in Step 4 to usethe IdleAnim 
variable astheanimation for the Output 
Animation Pose. Go back out and set up the 
Walk stateto usethe WalkAnim (Figure 14.23). 
Compile and savethe blueprint. 

Step 7: Usetheanimation blueprint in our player 
character. Open BP Character. Baseand select 
Mesh in the Components panel. In the Details 
panel, set the Anim Cass to AnimBP Hlen 
(Figure 14.24). 


Play Animation Sequence © Output Animation Pose 


Sequence $ pn | Result 
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Play the game now, and we can now see that the Ellen _ 
FPS Gun ldle animation is playing. Start moving, and the 
animation transitions to Ellen FPS Gun Walk smoothly, 
stop walking, and it also transitions back. 


We have now f nished some animation set up with the 
animation blueprint. As you can see, animation blueprint 
has two major components: 


l Anevent graph that allows usto communicate with 
the player character. 

2. Ananimation graph to determine what animation 
to play. 


These two components allow the animation blueprint 
to know what is going on with the player and play the 
animations accordingly. 


Let's review the unreal engine framework we have 
Covered. So far, we havetalked about these major 
components: 


Game Mode 


Game mode determines the major classes and the rules 
of the game. It def nesthe player character class, the 
player controller class, HUD, and many other classes the 
framework has that we have yet to explore. 


Player Controller/ 
Controller/Al Controller 


We have only mentioned their existence. Whenever 
you start the game, a player controller got created 





to represent you. It then possesses the default pawn 

def ned in the game mode, which you own through 

the player controller. Player controller is a child class of 
Controller. Controller already can possess a pawn, and 
it's tied up with the pawn and able to react to many 
things that happened to the pawn. Controller has a child 
class called AlController, which represents an Al instead 
of a human player. 


Actor 


Anything you can place in the level is an actor. It is 

the parent class of many other classes like Pawn and 
Character. It is also the parent class of classes that do not 
necessarily need a physical representation. Game mode Is 
a child class of Actor as well. 


Pawn 


Pawn isthe base class for anything that can be possessed 
by acontroller. A pawn is the physical representation of a 
controller, and a controller is the soul of a pawn. 


Character 


Character is a child class of Pawn. It has many built-in 
features like movements, a mesh to represent the body, 
and a capsuleto represent its collision. 


Skeletal Mesh 


Skeletal mesh is a class that represents a rigged model 
with joints that can use dif erent animation assets. 


Animation Blueprint 


Animation blueprint is a class designed to communicate 
with a pawn and control the animation of a skeletal mesh 
through its animation graph. 
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Widget Blueprints 


Widget Blueprint is the basic UI class that can be spawned, 
owned by a player controller, and can be added to the 
viewport. 


As you can gradually see, each class def nes a specif c type 
of object and does its own thing. Classes can also talk 

with each other and tie together into a framework for a 
working game. How to design these classes is critical for 
the game and the game engine, and it takes a tremendous 
amount of experience and testing to polish up and create 
an optimal design. 


Onething we can learn from Unreal Engine's framework 
here is that classes we def ne should have specif c 
purposes and can be added, changed, and swapped 
out. Consider making a game from scratch. You are likely 
going to create a player character class that has many 
things built in it. You will probably not have a player 
controller class in mind. But then you are going to realize 
that assuming the player and the character the player is 
playing as one thing has a problem: 


What if the character the player is controlling is dead? But 
the player stays in the games as an observer? What if you 
want to change the thing the player is controlling froma 
human character to a tank? Then it makes sense to make 
the player a dif erent entity other than the character. 


There is no best practice on how games should be 
structured because all games are dif erent. However, the 
general rule of thumb is to make your system easy to work 
with and need minimum tweaks when you need to make 
changes or add new features. Separating dif erent parts 
of the game into smaller, logically dif erent modules is a 
great way to achieve that. 


We are going to create our weapons in the next chapter, 
and we are going to design our weapons with the 
same ideal. 





Weapons 





Walking around empty-handed is not a very good idea to 
survive in this highly guarded facility. Let's create some 
weapons in this chapter to give the player some power. 
Buckle up, because this chapter is considerably longer and 
harder than the previous ones— we have a lot to cover. 


Before moving on, also be aware that this engine version 
we are using now is Unreal Engine 4.25. If yours isa 

dif erent version, the UI layout could be slightly dif erent. 
Also, we have provided the modelsfor the three weapons 
we are going to create in the support f le, and they are in 
the folder called weapons. Go ahead and import them to 
the project, and set up their materials as well. 
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In this chapter, we are going to implement three weapons: 





l Apipethat can knock down an enemy. 

2. Agun that shoots bullets and deals Damage to an 
enemy. 

3. Agrenade launcher that shoots out grenades and 
deals Damage. 


Let's analyze what parts of the three weapons can be 
generalized or, in other words, can be in a parent class. 


l. Visual. They all need a physical representation or a 
model. 

2. Uland icon. Most weapons need a Ul and an icon. We 
can add an icon of each weapon to the lower right 
corner of the game to show the player what they have. 
For UI, we need crosshair for the gun and the grenade 
launcher. 

3. Theyall attack in one way or another. It is an abstract 
idea that can be generalized. 

4. Attack damage. Again, not all of them need it, but a 
general part that most weapons would have. 

5. Reloading. Well, the pipe cannot reload, but an electric 
staf that shoots out lighting balls might need some 
sort of recharging. Reloading is also an abstract idea 
here. We assume that most weapons need to replenish 
at some point, and we choose to include this for the 
scalability of the game. 

6. Animations. All animations needed for walking, idle, 
Attack, and Reloading need to be specif ed. 

7. Attachment. We need to def ne how the player should 
hold these weapons. 

8. Hotkey. We need a keyboard or gamepad short cut for 
each weapon. 


As you can see, we need plenty of stuf already, and they 
can all be generalized into a base class, just like the BP - 
Triggerable we created for anything that can be triggered. 
You can come up with your own list of stuf you think that 
you want in all your weapons, and sometimes you just 
haveto start working on it to know what is needed. You 
cannot predict everything you ever need. It is common 
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to modify this list during development, so we are not 
married to any of these ideas yet. 


Meanwhile, we also have to develop our player character 
while developing the weapons for picking up a weapon, 
reloading, attacking, and switch weapons. 


Let’s start with making a base weapon class that all other 
weapons will inherit from. We are going to use the pipe to 
set up a base class; the asset of the pipe is provided in the 
support f les if you are using your project. 


Tutorial 15.1: Create a 
Base Weapon Class 


Step 1: Create a blueprint class. Create a new 
folder called Weapons in the Blueprints folder. 
Insidethe folder, create a new blueprint class, 
pick Actor asits parent class, and nameit 
BP Weapon Base 

Step 2: Add visual representation to the dass. 
Open BP Weapon Base, add a StaticMesh 
component to it, and namethe component 
Mesh. Set the Static Mesh to weapon pipe 
(Figure 15.1). 

Wechosepipe;just to beableto see 
something. The child classes will def nether 
visuals dif erently by changing this static mesh. 

To beableto hold it in the character's hand, 
we need to def ne where precisely in the hand of 
the player character to attach it. We can achieve 
that by def ning a socket in the skeletal mesh of 
the player character. 


KX ~ Fada m r E 
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Step 3: Set upthe socket for the pipe. Go to 
Blueprints/Characters/ Hlen/MeshAssets/ and 
double click to open Elen Skeletal Mesh _ 
Skeleton. Click on the Preview Animation in the 
toolbar at the top of the UI and choose FPS _ 

Pipe Idle. Themesh now playstheFPS Pipe Idle 
animation. It doesn't matter if you seethe 
full-body mesh orthe FPS mesh in the viewport 
because you can changethe Preview Mesh to the 
other oneif you wish. Theanimation is playing, 
dick on the pause button at the bottom of the 
window to pauseit. 

In the Skeleton Treelist, f nd r wrist, 
right dick on it, and select Add Socket. A 
new socket called r wristSocket got added 
to thelist, doubleclick, and rename it to 
PipeHandSocket. 





Socket 


There are plenty of times you need to attach something 
to the character, and you can attach anything to any joint 
of the skeletal mesh. However, it is improbable that you 
want the attachment to be precisely where the joint is, 
but preferably with an of set. You can add a socket as a 
predef ned location in the hierarchy of a skeleton for you 
to attach anything to it. Any joint can behave like a socket 
as well. 


Right click on PipeHandSocket and select Add Preview 
Asset, search, and select weapon pipe. Go to the 
viewport, move, and rotate it to make the pipef t into the 
hands nicely (Figure 15.2). Press the Save button to save 
the changes. 


Step 4: Add an attachment variable. Go back to 
BP Weapon Base. Add a new variableand 
nameit EquipSocketName. Makethe Variable 
TypeName, compile it, and se the Default value 
to PipeHandSocket. We add this variable, so the 
weapon can always refer to it to f nd the correct 
attachment (Figure 15.3). 
Now the weapon knows where it should 
attach to, let’s makethe character to hold it. 
Step 5: Create a function for the character to acquire 
a new weapon. Go back to BP Character. Base. 
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Add a new custom event (right dick and 

search for add custom event), and name it 
AcquireNewWeapon. Co to the Details panel and 
add a new input parameter to it. Namethe new 
parameter WeaponClass and changeitstypeto 
BP Weapon Base makesurethat you choose 


Glass Reference (Figure 15.4). 
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By choosing a class reference, we are taking in a class 
instead of an object of a class. We can now use this class to 
Spawn a weapon: 


Create a Soawn Actor from Class (right click and 

search) node. Connect the out execution pin of 
AcquireNewWeapon to the in execution pin of the Soawn 
Actor NONE node to call it with AcquireNewWeapon. 
Connect the Weapon Class pin of AcquireNewWeapon 

to the Class input pin of the Soawn Actor NONE node 
(Figure 15.5). 


For the Soawn Transform, we can use the transform 

of the socket. Hold down Ctrl and drag the Mesh 
fromthe Components panel to the graph to create 
areference for it. Drag out fromthe pin of the new 

Mesh node, search, and create a Get Socket Transform 
node. Connect the Return Value of the Get Socket 
Transform node to the Spawn Transform input pin of the 
SpawnActor node. 


For the In Socket Name, drag out from the Weapon Class 
pin of the AcquireNewWeapon, search, and create a Get 
Class Defaults node. Drag the Equip Socket Name pin of 
the Get Class Defaults node to the In Socket Name of the 
Get Socket Transform node (Figure 15.6). 


This piece of code spawns a BP Weapon Base at the 
socket of the weapon. 


Click the expansion arrow at the bottom of the 
SpawnActor node, and you can see that we can specify an 
owner and an instigator for this new weapon. 
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Owner 


Owner is a handy member variable of the actor class, and 
it is used to store the logical Owner of the Actor. 


Instigator 


Instigator is another handy member variable of the actor 
Class, and it should store the logical instigator of the 
damage or other events this Actor causes. 


The Owner and instigator of an actor could be the same 
thing, and they usually are. However, consider a grenade 
of a grenade launcher; logically, the grenade launcher is 
the Owner of the grenade, but the instigator should be 
the player who is holding the grenade launcher. After all, 
it isthe player who pulls the trigger. It is also common for 
an actor to have no owner or instigator. These are abstract 
concepts that are built-in in Unreal Engine, and other 
systems in the engine use them as part of the payload 
data. In our case, we want this BP Character Base asthe 
Owner and instigator of the new weapon. 


Right click in an empty area and search for “self”, in the 
drop-down list, select Get a reference to self. Connect this 
new Self node to the Owner and Instigator input pin of 
the SpawnActor node (Figure 15.7). 


Finally, create an AttachActorToComponent node, and 
call it with the SpawnActor node. Use the return value 

of the Spawn actor node asthe Target, use the Mesh as 
the Parent, and use the Equip Socket Name of the Get 
Class Defaults node as the Socket name. Set the Location, 
Rotation, and Scale rulesto Snap to Target. 
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Notice that the line connecting from the Equip Socket 
Name of the Get Class Defaults node to the Socket Name 
of the AttachActorToComponent node is too long. The 
line is also overlapping the nodes in the middle. Double 
click anywhere on the line to create a reroute node, and 
move the reroute node to make the line go around other 
nodes (Figure 15.8). 


What we did with this AcquireNewWeapon can be 
translated to plain English as: 


Createa new weapon and attach it to the 
corresponding slot of the mesh. 


The Get Class Default node is self-explanatory; it gives 

us the values of the variables we set up in the class. 
AttachActorToComponent attaches Target to Parent. If there 
is a specif ed socket name, the attachment isto the socket. 
Otherwise, the attachment attaches to the root of Parent. 


Figure 15.8 shows all the things we did in Step 5. As you 
can see, node-based scripting or visual scripting can get 
complicated quickly, and good organization becomes 
very important. 
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Why? 


We implemented this function or event in BP_Character_ 
Base class instead of the BP_Ellen_ FPS. The reason is 
primarily for the scalability of the game. We can create Al 
characters based on BP_Character_Base as well, and the Al 
should have the ability to acquire a weapon right away. 


As you have gotten familiar with blueprint scripting, 
from now on, let's omit trivial details of the creation and 
connect of the nodes to save your reading time. We are 
going to focus on mentioning the essential part of the 
node graph. 


Step 6: Test our function. Zoom out of the graph, 

f nd the Event BeginPlay event, and call our 
AcquireNewWeapon function with Event 
BeginPlay. Play the game and you should seethe 
character now holding the pipe (Figure 15.9). 

Therearetwo f awshere. First of all, try to 
move around, and you will havea hard time 
moving forward. Thisis becausethe pipeis 
colliding with you. Secondly, the animations 
areforthegun and not the pipe. Let's address 
thesetwo issues. 

Step 7: Fixthe weapon collision. Open BP Weapon . 
Baseand select the Mesh in the Components 
panel. In the Details panel, f nd the Collision 
section and set Collision Presetsto NoCollision. 
Playthegame again and you should beableto 
movefreely. 

Step 8: Add animation variablesto the weapon dass. 
Add two more variablesto BP Weapon Base, 
and set their variabletypeto Anim Sequence 
object reference. Namethef rst oneldleAnim, 


© Acquire New Weapon 


Q Event BeginPlay 
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and set its default valueto Hlen FPS Pipe Idle. 
Namethe second one WalkAnim and set its 
default valueto Hlen FPS Pipe Walk. 
Adding thesetwo variables does not do 
anything good for us, and weneed to let the 
animation blueprint know and usethem. 
Also, we will implement weapon switching 
and pick up functionalities. Every time we 
pick up a new weapon or switched to another 
weapon, theanimations in the animation 
blueprint should update. Let's createa 
variableto storethe current active weapon 
and implement a function that can spit out 
theidle and walkanimation of that weapon. 

Step 9: Createa current active weapon variable. 
Go backto BP Character. Baseand add 
a new variable. Namethe new variable 
CurrentActiveWeapon and set the variable 
typeto BP Weapon Baseobject reference. 
Goto the AcquireNewWeapons, breakthe 
connections between the SpawnActor node and 
theAttachActorToComponent node, and insert 
a Set Current Active Weapon Nodein-between 
(Figure 15.10). 

Step 10: Create a function to get the animations 
fromthecurrent active weapon. Add a new 
functionto BP Character. Baseand call it 
GetActiveWeaponAnims. Implement it as 
Figure 15.11. 

Beawarethat this is a function added 
by dicking the "4" button in the Functions 
section under the My Blueprint panel. We 
had created a function before when we 





- AttachActorToComponent 
4Variables # Spawnctor 


CurrentActiveWeapon 


EE GEG CurrentActiveWeapon 5 E uh. 
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weredoing the BP Triggerable. We created a 
function instead of a custom event because 
weneed to haveretum values. Retum values 
are added by selecting the entry node of the 
function and click the “+ sign in the Outputs 
section of the Details panel. 

Thebody of thefunction is relatively 
simple. We get the CurmentActiveWeapon and 
get itsidleand walk animation asthe retum 
valuesof thefunction. 

Step 11: Call thefunction in theanimation blueprint 
to updatetheanimations. Go to Content/ 
Blueprints/Characters.Hlen/Animations and 
open AnimBP Hlen. Go to the My Blueprint 
pane and double click the EventGraph under 
the Graphs section to go to its event graph. After 
the SET node, add the blueprint script shown in 
Figure 15.12. 


By using the Try Get Pawn Owner function, we can 

get the pawn that this blueprint is attached to. In 

our case, the Owner is our BP Character Base, so 

we cast it to BP Character Base to get access to the 
GetActiveWeaponAnims function. We then call that 
function and use its retum values to update our IdleAnim 
and WalkAnim variables. 


Play the game again, and now you should see that the 
correct idle and walk animation are being used for the 
pipe. Just like how we get the IsMoving set up before 
for the animation blueprint, we have now set up the 
animations as well. 


What is happening now is that the animation blueprint 
constantly updates its IdleAnim and WalkAnim by calling 
the GetActiveWeaponAnims function of BP Character - 
Base and usesthem asthe animation in the state machine. 


»+ Cast To BP_Charac ter_Base J Get Active Weapon Anims 
Ld Ld 
Object Cast Failed D 


As BP Character Base 


J Try Get Pawn Owner 


Target | self | Return Value 
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However, when you press the escape button to stop 
playing, a Message Log window pops up and showstwo 
errors. They all read as "Accessed None trying to read 
property CurrentActiveWeapon." The message also shows 
wherethe error occurs; in this case, the return node of the 
GetActiveWeaponAnims function. 


At the very beginning of the game, the animation 
blueprint is already calling GetActiveWeapons. At that 
moment, the AcquireNewWeapon is not called or maybe 
not at the step of setting up the CurrentActiveWeapon 
variable yet. The value of the CurrentActiveWeapon 
variable is empty or None. We cannot pull data from an 
empty variable because there is no data, and this is why 
we got the errors. If you think about it now, there are two 
design f aws in our current set up: 


l What if the player hasn't picked any weapon yet? 

We do want the player to have no weapons at the 
beginning of the game and will pick up new weapons 
while exploring the level. 

2. Wedo not need the animations to be updated every 
time the game updates; we only need to change them 
when the player picks up or switches to a dif erent 
weapon. 


Knowing what you want in your game is critical when it 
comesto design the structure of your game. In our case, 
the player will have no weapon at the beginning. And 
when they pick up a new weapon or switch to another 
one, we want to put the hands-down f rst. We then attach 
the new weapon to the hands of -screen and raise the 
hands with the correct animation associated with that 
attached weapon. Let's make that hands-down animation 
f rst and usethat to drive the weapon pickup and 
switching mechanics. 


Step 12: Set up a weapon switch animation. Make 
surethat you save your blueprints. Close and 
reopen Hlen Skeletal Mesh Skeleton so that no 
preview animation is used. Go to thetoolbar at 
thetop of the window, and dick Create Asset > 
Create Animation > Current Pose. Select the 
Animationsfolder in the pop-up window, and 


a “AL Create a New Animation Asset 


amar Select Path to create animation 


meme Search Folders © 


ni Content 
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set the Animation Nameto Hlen FPS Weapon _ 
Switch. Unreal now creates a new animation, 
and we can seeit in the list of the Asset Browser 
at the lower right comer of the window 

(Figure 15.13). It is also currently selected. 


Persona 


The window we see now is called Persona. It collects all 
the essential parts of the skeletal mesh. At the top right 

of the window, you can see f ve major parts: the skeleton, 
the mesh, the animation, the animation blueprint, and the 
physics assets. We can quickly switch to these assets by 
clicking on them. Figure 15.14 shows the break down of 
the UI. 
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Time Format 


Insert frame before 0 
Insert frame after 0 


Number of Frames to Append 





Append at the end 
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The buttons in the red box allow usto switch to other 
assets associated with the skeletal mesh quickly. The 

blue box is the Asset Browser, and it has a list of all the 
animations. The area in the yellow boxisthe timeline, 
where we can edit the animation and add other gameplay 
elements. We have talked about the other parts already. 


So far, this new animation we added has one frame, 

as indicated at the bottom of the timeline. Right click 
anywhere on the timeline and select Append in the 
beginning. Type in 9 forthe Number of Framesto Append 
and hit Enter. We now have ten frames in total. Click the 
Pause button at the bottom left corner of the timeline to 
pause the animation playback (Figure 15.15). 


Why? 


Ten frames for a switching animation seem to be too 
little, but we want the player to feel the game being super 
responsive. In many cases, it is not about how realistic the 
game is. It is about how good the user experience is. 


In the Skeleton Tree panel, select spine 04. Rotate it to 
bend the body forward in the viewport (about 60 degrees) 
and pressthe S key on the keyboard to add a key. It 
doesn't matter on which frame we added the key because 
we only need a f xed bend-down pose. Clickthe Apply 
button in thetoolbar to commit the changes. 


Go to the Asset Details panel (it is shuf ed with the 
Skeleton Tree panel). Under the Additive Settings section, 
set the Additive Anim Type to Local Space. This animation 
now becomes an animation that will be added on top 

of other animations when used. The Base Pose Type is 





Skeleton Reference. This setting means that it calculates 
the dif erence between the poses in this animation with 
the default skeleton pose in local soace and extracts the 
delta as the additive or of set information (Figure 15.16). 
Press the Save button to save the asset. 


Step 13: Create the weapon switch animation 
montage. Adick the Create Asset again and select 
Anim Montage. Nameit BHlen_ FPS Weapon _ 
Switch Montageand hit ok. Unreal now has 
created an animation montagefor us and 
opened it in Persona. Noticethat it Shows with 
a blueicon in the Asse Browser. Go to the Asset 
browser, f nd, and drag Elen FPS Weapon _ 
Switch to the DefaultGroup.DefaultSlot row of 
thetimeline (Figure 15.17). Press the Save button 
to savethe asset. 

Go to the Asset Details panel. Open the 
Blend In and Blend Out sectionsin the Blend 
Options section. Set both Blend Time settings 
to 0.15. This makes the animation to blend in 
and out in 0.15 seconds. 
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Animation Montage 


Fromtime to time, we just want to quickly play an 
animation on top of the current state machine animations, 
and Animation Montage is designed for that purpose. 
Animation montage montages the animation in it on 

top of others. Animation montage has a slot assigned 

to it. The default slot for a new animation montage is 
DefaultGroup.DefaultSlot. When we ask the engine to play 
an animation montage, it f nds its slot in the AnimGraph 
of the animation blueprint and plays its animation over 
there. Let's add the slot in the animation graph. 


Step 14: Add the DefaultSlot. Clickthe Blueprint 
button at thetop right comer of the window to 
Switch to our animation blueprint. Double dick 
theAnimGraph in the My Blueprint panel to open 
the animation graph. Create a Slot ‘Default Slot’ 
node and insert it in-between IdleWalk and the 
Output Pose (Figure 15.19). Compile and savethe 
animation blueprint. Remember, you can Alt- 
click on any pin to deletethe connections to it. 

Step 15: Add a custom event to play the animation 
montage. Go back to BP Character. Base. 
Createa new custom event called 
SwitchActiveWeaponTo and implement it as 
shown in Figure 15.19. The Montageto Play is set 
to Hlen FPS Weapon Switch Montage. 

Wewill add more stuf to thisfunction, so 
it does what the name says. For now, weare 
just testing the animation montage. 

Step 16: Test the animation Montage with thef re 
button. Create an InputAction Fire node and call 
the SwitchActiveWeaponTo with InputActionFire 
(Figure 15.20). 

Playthegameagain, try left clicking, and 
you can seethe hands go down and back up 
again. 


Output Pose 


IdleWalk Slot 'DefaultSlot' 


j Source — il Result 
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Pressed > [3 


Released [> Target | self 


Key 


Ok, wehave gonethrough many small 
things hereto get to this stage. Let's explain 
what is going on when weleft click before 
adding too much stuf . 

When we press the left mouse button, 
the system triggers thef re event (def ned in 
theinput bindings). Thef reevent callsthe 
SwitchActiveWeaponTo event, which asks 
the Mesh to play the Hlen_FPS Weapon _ 





€» Switch Active Weapon to 
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Switch_Montage animation montage. Hlen _ 


FPS Weapon Switch Montageisassigned 
with the DefaultGroup.DefaultSlot, and 
the Mesh f nds that dots in theAnimGraph 
of the animation blueprint and plays the 
animation montagethere. Theanimation in 
the montage (Hlen FPS Weapon Switch) 
is additive. So, the montage adds on top of 
the current Elen FPS Pipe Idleanimation 
to bend the body down. The body then 
bends down smoothly in 0.15 seconds and 
bends back up after the animation is over 
(in 0.15 seconds as well). 

As you can see, the whole system works 
in a somewhat complicated way. This isthe 
nature of Unreal Engine. It is not an easy 
engine, like what we have covered before; 
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Unreal values professionalism and scalability 
morethan simplicity. You will constantly see 
Unreal Engine enforces workf ows likethis 
that you don't grasp right away. However, 
once you f nally understand it, you will realize 
that it is probably the best way (although 
strange sometimes) to do it. 

Let's go back and think about what 
the weapon should do when it comesto 
acquiring or switching new weapons. 
Because we are doing an FPS game, we don't 
haveto put the weapon somewhere else 
when we equip it or switch it out. Whenever 
we got a new weapon, it attaches and 
remains attached to thehands, but we make 
it invisiblef rst. When we switch to oneof the 
weapons, we play the animation montageto 
makethe hands go down. When they are of - 
screen, wehide whatever is currently visible 
(or not if the hands are empty). Wethen 
unhidethe weapon we want to switch to, 
updatetheanimations, and then the hands 
go back up with the new weapon. 

That means that the weapon has two 
States: in inventory and in hand. In inventory 
means that it is invisible in hand means 
that itis visible. Let’s createtwo functions in 
theBP Weapon _ Base dass to changethe 
weapon to thesetwo states. 

Step 17: Create a Weaponlninventory and 
a WeaponinHand custom event. Open 
BP Weapon Baseand quickly implement a 
Weaponlninventory and a WeaponinHand 
custom event as shown in Figure 15.21. 

The Set Visibility function sets the 
visibility of the Target input. Make surethat 
you drag the DefaultSceneRoot fromthe 
Components to the Target and check on 
Propagate to Children so everything will be 
toggled. 


© Weaponininventory : S Set Visibility €^ WeaponinHand J Set Visibility 


Target Target 


——_—ESEEee 
New Visibility 2) Default Scene Root New Visibility A 
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Default Scene Root 
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F SpawnActor 


Step 18: Use the Weaponlninventory function 


in the AcquireNewWeapon functions. Go 
backto the AcugireNewWeapon function 

of BP Character Baseand deletethe Set 

node between SpawnActor and AttachActor 
ToComponent. Drag out fromthe Retum Value 
of the SpawnActor node, search, and create 

a call to Weapon in Inventory asshown in 
Figure 15.22. Makesurethat you still call the 
AttchActorToComponent eventually. 

What wehave changed hereis when we 
get a new weapon, we put it in the inventory 
f rst (which makesit invisible). Afterthis step, 
wethen haveto playthe weapon switch 
animation montageto put the hands down. 
Then we makethe weapon visible (by calling 
WeaponlnHand) and tell theanimation 
blueprint to updateto the new animations, 
and then the hands go back up. We can put 
these parts in the SwichActiveWeaponTo 
event. 


Step 19: Ref ne SwitchActiveWeaponTo. Add a new 


Input parameter to the SwichActiveWeaponTo, 
namethe parameter NewActiveWeapon, and 
makethe variable-typeBP Weapon Base. 
Drag out fromthe New Active Weapon of the 
SwitchActiveWeaponTo and select Promote 

to variable. Anew variable got automatically 
added, and a Set node got created as well. This 
isa quick way to makea new variable and set 
its value. We will not mention steps likethis 
anymore. When you seea Set nodelikethis with 
a variable name you haven't seen before please 
assumethat we created a new variable with the 
Promoteto variable command. 

Namethe new variable 
PendingNextActiveWeapon, and the Set node 
automatically changes. Connect the Set node 
as Figure 15.23. 
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Whileweareat it, let's also add a call 
to SwitchActiveWeaponrTo at the End of the 
AcquireNewWeapon event (Figure 15.24). 

Noticethat weadded two reroute nodes 
between the Retum Value (the spawned new 
weapon) and the New Active Weapon input 
parameter of the SwitchActiveWeaponTo 
node. You can create a reroute node, just 
like how you create other nodes (right click 
and search). What wearedoing hereis after 
acquiring a new weapon, we want to switch 
toit right away. 

However, the SwitchActiveWeaponTo 
does nothing morethan set a 
PendingNextActiveWeapon variable and play 
theanimation montageat the moment. Play 
thegamenow, and weno longer seethe pipe 
or the hands. Quit the game and we even get 
more errors. Luckily, they areall complaining 
about onething: the CurrentActi veWeapon 
is None. This makes sense because we never 
Set it after we adjust the code. We want to set 
it when it isactuallyin hand and that should 
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happen when the hands are down during 
theanimation montage. To know when the 
handsaredown, wecan placean animation 
notify in the animation montage. 

Step 20: Add an animation notify. Go to Blueprints/ 
Characters/Animations/ and f nd Hlen FPS 
Weapon Switch Montage. Doubledickto 
open it, and pressthe space bar to pausethe 
animation playback. There are multiple sections 
of thetimelinelisted at the left side column. The 
Montage section has our Hlen_FPS Weapon - 
Switch animation, and this isthe part that you 
populate animation assets for the montage. The 
Notif es section undemeath is where we can add 
animation notif es, and there is currently one 
track named "T" in it. Right dick anywhere of that 
onetrack in thetimeline and select Add Notify ^ 
New Notify. In the pop-up Notify Name, typein 
WeaponSwitchHandDown as its name and press 
Enter to add it. Adiamond-shaped point with a 
WeaponSwitchHandDown sticker got placein 
thetimeline drag it to reposition it around frame 
5 (Figure 15.25). 

When theanimation montage 
is playing, itf res an event called 
WeaponSwitchHandDown when the 
animation reaches frame 5, and thisisthe 
timethe hands should bedown at thelowest 
point. To listen to that event, we just need to 
add a call to it in the animation blueprint. 
Let's go ahead and do that. 

Step 21: Add an AnimNotify event. Go to the event 
graph of the animation blueprint (you can switch 
to dif erent graphs by doubleclicking themin 
the My Blueprint panel). Right dick in the graph 
and search for WeaponSwitchHandDown, and 
there should beonly one option called Event 
AnimNitofy WeaponSwitchHandDown. Click 
on itto add it to the graph. This event runs when 
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thenotify ishitinthetimeline. Let's print out a 
"Hands are down" message with it using the print 
function (Figure 15.26). 

Playthegamenow, and you can seethat 
themessage got printed, and every time you 

left click, the message will be printed after f ve 

frames becausethat is when the notify is hit 

in thetimeine. 

Step 22: Createa function to set up 

the active weapon. Go back to BP _ 

Character Base. Createa function called 

WeaponSwitchHandsDownNotify. Add a 

Sequence node, and pressthe Add pin label of 

the Sequence node to add another pin. Construct 

the rest of the function as Figure 15.27. 

This WeaponSwitchHandsDownNotify 

event does two things: 

First of all, it checksif thereisa 
CurrentActiveWeapon by passing it 
through an Is Valid node, and then calls its 
Weaponlninventory event to hide it. 

Second, it sets the CurrentActiveWeapon 
variableto bethe PendingNextActi veWeapon 
weset up in the SwitchActiveWeaponTo 
event. This should set the value of the 
CurrentActiveWeapon to the new weapon 
we acquired. It then calls the WeaponInHand 
function to makethe new weapon visible. 
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The Sequenceis a convenient way of saying 
do onething f rst and then the next one. 
So, it will do Then Ofollowed by Then 1, and 
you can add more pinsto do morestuf ina 
sequence. We use it to makethe graph easier 
to understand. Thefunction can also bedone 
like Figure 15.28, and you haveto call the Set 
nodeafter both the Weapon in Inventory and 
Is Not Valid execution pin. 

Wechoseto usethe sequence node 
becauseit looks dean. 


Step 23: Call WeaponSwitchHandsDownNotify in the 


animation blueprint. Go backto theanimation 
blueprint. Removethe print node and reconstruct 
theAnimNitofy WeaponSwitchHandDown 
event as Figure 15.29. Delete all the nodes after 
the Set Is Moving nodein the Event Blueprint 
UpdateAnimation event. 

What happens now is when the 
animation notify f res, we call the 
WeaponSwitchHandsDownNotif y event of the 
BP Character base, and thefunction doesthe 
show and hide of the weapons and updates the 
value of the CurrentActiveWeapon vanable. After 
that, wethen gather the new animations for the 
animation blueprint. 

To beableto seethe result, go to 
BP Character Baseand insert a Delay node 
between Event BeginPlay and Acquire New 
Weapon. Set the Duration of the Delay node 
to 2.0 (Figure 15.30). This Delay node adds 
a 2-second delay before calling the Acquire 
New Weapon event. 


Q WeaponSwitchHandsDownNotify 
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Playthegameagain and now you can 
seethat we start with the gun idleanimation. 
After 2 seconds, thehands go down and come 
back again with the pipe. The animation is 
also switched correctly. 

Step 24: Remove the gun animations. We should 
not beplaying theanimations of the gun at the 
beginning of the game. Go to the Animation 
blueprint, and select theldleAnim variablein 
the Variables section. Go to the Details panel, 
click the drop-down of the default value of the 
IdleAnim, and select clear to make it empty. 
When it's empty, the default pose is used. You 
can also deletethe InputAction Fire event. It is 
only created for testing. 

Playthegameonemoretime, andthe 
player should now start with no animations. 
After 2 seconds, the player's character pulls 
out a pipe. 

If you arehaving trouble keeping track 
of what is going on, you can create diagrams 
like Figure 15.31 to havean overview of the 
series of events. Diagrams likethis can also be 
atool for planning the program. 

Weare not entirely done with this part 
yet. We will revisit it after we have morethan 
one weapon. Meanwhile, let's moveon to 
add theattack animation. 

Step 25: Createthe Attack animation montage. 
Goto Blueprints/Characters Hlen/Animations 
andf nd Hlen_FPS Pipe Attack. This 
animation isthe Attack animation of the 
pipe. Right click on it and select Create 2 
Create AnimMontage. An animation montage 
got created in the samefolder; press Enter 
to usethedefault name Unreal givesit 
(Elen FPS Pipe Attack Montage). 

Open BP Weapon Base, select 
the WalkAnim variable, press Cirl +W 
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AquireNewWeapon 
1,Creat a new weapon 

2,Hide it (Weapon in inventory) 

3, Attach it to the hand 


SwitchActiveWeaponTo 


1,Store the new weapon as a variable (PendingNextActiveWeapon) 
2,Play the Switch weapon animation montage 


Montage plays 

1, Aniamtion plays as additive and bends the body down 
The hands are down in the animation after 5 frames 

2,Montage hits the notify in the timeline 

3, AnimNotify_WeaponSwitchHandDown is triggered. 


AnimNotify WeaponSwitchHandDown 


1,Finds the character and calls 
the WeaponSwitchHandsDownNotify event 


WeaponSwitchHandsDownNotify 


1,Make the current active weapon invisible (WeaponInInventory) 

2,Set the current active weapon as the new weapon 
(PendingNextAct i veWeapon) 

3, Makes the new current active weapon visible (WeaponInHand) 


2,Get the new animations from the character and 
use them as the IdleAnim and WalkAnim 





4, Montage keeps going and eventually blends back 
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to duplicate it, and nameit AttackAM. 
Changethe vanabletype of AttackAM 
to Anim Montage object reference. 
Compile and savethe blueprint and then 
set the default value of AttackAM to 
Hlen FPS Pipe Attack Montage. 

Step 26: Createan event to play the attack 
animation montage. Create a PlayAttackAM 
event for BP Weapon Baseasshownin 
Figure 15.32. 

This PlayAttackAM event does what 
thenamesays: play the attack animation 
montage. The Get Owner function retums 


© PlayAttackAM © 


>+ Cast To Character fm Play Montage 
& D- D 


Object Cast Failed D In Skeletal Mesh Component On Completed [> 
P - : 
As Character Target Mes Montage to Play On Blend Out D 
J Get Owner 


Play Rate | 1.0] On Interrupted > 


1 i Attack AM . - 
Target | self Return Value - s Starting Position | 0.0 | On Notify Begin D 


» Starting Section [None] On Notify End D> 


Notify Name 
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the Owner of this weapon; if you do recall, we 
set it to the BP_Character_Basethat acquires 
this weapon in the AcquireNewWeapon 
function. Theretum valueis an actor, and we 
cast it to a character so we can get access to 
its Mesh component. Wethen ask its Mesh 
component to play the AttackAM animation 
montage. 

Step 27: Refactor the part to get the Mesh 
component into a function. We will need to 
get the Mesh component in other places of 
BP Weapon Base. Let's refactor this part of the 
code into a function to clean up our code. With 
the Get Owner, Cast To Character, and Target 
Mesh selected, right dick on any oneof then and 
select Collapseto Function. A new function got 
created that has all three nodes inside. Go to the 
My Blueprint panel, select the New Funcntion O, 
press F2, and renameit to GetPawnSkeletal Mesh 
(Figure 15.33). 

Step 28: Makethefunction blueprint pure. Select 
GetPawnSkeletalMesh in the My Blueprint panel. 
Go to the Details panel and check on the Pure 
checkbox. The function is now a purefunction. 
Purefunctions do not have execution pins; they 
arecalled when their retum values are used 
(Figure 15.34). 

Step 29: Make an empty CommitAttackAnimNotify 
event. Wewant to do the real attacking things 
like deal damage or launch a grenade at some 








Get Pawn Skeletal Mesh 


bP--T—-P 
Mesh 


© PlayAttackAM ae 
fm Play Montage 


è 
In Skeletal Mesh Component 
Get Pawn Skeletal Mesh 
Montage to Play 
Mesh E 
Play Rate | 1.0 | 


Starting Position | 0.0 | 


Attack AM 


Starting Section [ None | 
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ag © 


© Play Attack AM 


Target | self 


© CommitAttackAnimNotify m 
Custom Event 


D 


"© PlayAttackAM a 
Gustom E [- Play Montage 

| 1:  —_ D D 

. In Skeletal Mesh Component e nec l 

J Get Pawn Skeletal Mesh atin Meike mpanao On Completed D 


Yren Montage to Play On Blend Out > 
Mesh af 


» Play Rate | 1.0] On Interrupted D 
Attack AM > Starting Position 0 0] On Notify Begin [> 
> Starting Section None | On Notify End D 


Notify Name © 
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point in the animation. The event doesn't 
necessarily happen at the beginning of the 
animation. We can useanimation notify to 
informthe weapon at thetime we really want 

to do theattacking things. Create a new custom 
event called CommitAttackAnimNotify and leave 


it empty. 

Step 30: Create the Attack event. Createa 
new custom event and call it Attack. Call 
PlayAttackAM with it. Drag a big marquee 
selection boxto select all the nodes of the 
Attack, the CommitAttackAnimNotify, and 
the PlayAttackAM event. Pressthe C button on 
the keyboard to make a comment box. Type 
in Attacking to renamethe boxto Attacking 
(Figure 15.35). 


Comment Box 


You can select any nodes and pressthe C button to warp 
them around with a comment box. This comment box 
does nothing to the programming, and it is a note for 
organization purposes only. You can drag the title of the 
boxto movethe entire box around. 
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Step 3L Set up the attack input. Goto BP Hlen FPS. 
Add the InputAction Fire event here, and 
implement it as shown in Figure 15.36. Playthe 
game again, and you can now left dickto attack 
afterthe player character getsthe pipe. 

Step 32: Firethe CommitAttackAnimNotify with 
an animation notify. Open Hlen FPS Pipe 
Attack Montageand add an animation notify 
atthetimethatthe pipeattack animation seems 
to about to hit something. Call this new notify 
CommitAttack (Figure 15.37). 

Go to the animation blueprint and 
implement the notify event as shown in 
Figure 15.38. 

What is happening now is when we left 
dick, the player character calls the attack 


E = i | © Attack 
Q InputAction Fire ? Is Valid Target is BP Weapon E 


Pressed ab Exec isVaid> — p> 
Released [> mE Input Object Is Not Valid D _ @& Target 


Key C} 


I———QÓ 00 LL e^ 
Current Active Weapon @ - 
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»» Cast To BP. Character. Base 


E R 
Object Cast Failed D 


J Try Get Pawn Owner 


Target | self 
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function of the active weapon, and itthen 
playsthe animation montage. When the 
montage hits the CommitAttack animation 
notify, it callsthe CommitAttackAnimNotify 
event of the active weapon. This structure is 
very similar to the structure of the acquired 
new weapon part. You will seethis structure 
being used forthe reload as well. 


Why? 


Alrighty, we have made a weapon class and able to attack 
with it. Well, only with animation, that is. However, it is 
pretty exciting already, and we have made a few things 
that may make your head tile and frown. You could argue 
that some of the things could be more straightforward. 
The attacking part we just did, for example: 


Why don't wejust call Play montage with the Attack 
event? 

Why do we create an empty event called 
CommitAttackAnimNotif y? 


Well, forthe f rst question, attacking and play-attacking 
animation are two dif erent things, and attacking needs 
to do the play-animation montage, but what if you are out 
of ammo? We separate these two functions so that we can 
insert more logic, and we combine these steps dif erently 
for dif erent child classes. This coding style is also called 
abstraction. It helps with the scalability of the game. It is 
abstract because it does apply to all weapons. It works for 
the weapon we have now, and it is going to work for the 
weapons we decided to add in anytime later on. 


For the second question, yes, it is empty, and it is going to 
remain empty. We call this kind of empty function virtual 


©} Commit Attack Anim Notify 
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functions. It is empty because there is nothing we can 
generalize here; the pipe and the gun attack in entirely 
dif erent ways. In BP Weapon Base, we just set up the 
calling of this event, and the child classes will override the 
CommitAttackNotify with whatever things they need to 
do, things like apply Damage or launch a grenade. 





Step 33: Makea BP. Pipe, a BP Gun, anda 
BP Grenade Launcher class. Right dick on BP « 
Weapon _ Base and select create child class, and 
namethenew dassBP Pipe. Createtwo more 
dassesthe same way, nameoneof them BP Gun 
and another one BP Grenade Launcher. 

Open BP Gun and changethe Static 
Mesh setting of the Mesh component to 
gun Gun body. Wealso havethegun _ 
Gun dipandthegun bullets model forthe 
gun. Drag thesetwo assets fromthe Content 
Browser to the Components to add them, 
and don't forget to set their collision presets 
to NoCollison as well. Open BP Grenade - 
Launcher and just changethe Mesh to 
Grenade launcher. Figure 15.39 showsthe 
hierarchy of the dasses and the seting of the 
gun and the grenadelauncher. 

Step 34: Set up the socket and Attack montageof the 
gun. Set up the socket of the gun the same way 
we set up the pipe and name it GunHandSocket. 
If the pipeis in the way, right dick the 
PipeHandSocket and select Remove All Attached 
Assets (Figure 15.40). 
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Create the attack animation montage 
of thegun the same way we created 
Hlen FPS Pipe Attack Montage. However, 
when you createthe animation notify, 
instead of adding a new one, you can f nd 
the CommitAttack in Add Notify Skeleton 
Notif es— CommitAttack (Figure 15.41). 

Step 35: Populatethe variables of BP. Gun. Open BP 
Gun. Sdect the BP_Gun(sef) inthe Components 
pand. Inthe Details pane, changethe Equip 
Socket Nameto GunHandSocket. Set the IdleAnim, 
Walk Anim, and Attack AM to theones of thegun. 

Step 36: Set up BP_GrenadeLauncher. Add the 
socket and animation montage for the grenade 
launcher and set up BP. Grenadel auncherthe 
same way we set up BP Gun. 

Step 37: Test the three weapons. Open BP 
Character _Base and f nd Event BeginPlay. 
Change the Weapon Cass of the Acquire New 
Weapon function call in the Event BeginPlay 
to BP_Pipe, BP_Gun, or BP_GrenadeLauncher. 
Play the game again and you can seeall three of 
them work as expected. After creating the base 
dass, wecan quickly create child dasses, and 
they should work with minimal setup. When we 
havea dassthat isinheriting a parent dass, we 
can also say that the dass is derived fromthe 
parent class. In this case, all three weapons are 
derived from BP Weapon Base. If we ever need 
another weapon, we create another child class of 
theBP Weapon Base. 
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Wehavenow laid out thefoundation of 
the weapons and created all three weapon 
dasses as well. Let's dip into more details of 
the weapon classes. 

Playthegameand let's spamtheleft 
mouse button and you can seethe Attack 
animation just keep restarting. Let's set up a 
weapon cooldown mechanic. 


Tutorial 15.2: Weapon 
Attack Cooldowns 


Step 1: Create a weapon state enumeration. Go 
to the weapons folder, right click, and select 
Blueprints ^. Enumeration. A new enumeration 
asset got created; name it EWeaponState. 


Enumeration 


When programming, sometimes, we want to describe 
alist of possible selections or status that each one of 
them Is unique. In the case of our weapons, all weapons 
could have three states: Idle, Attacking, and Reloading. 
Enumeration (or enum in short) is a built-in variable type 
that’s designed precisely for situations like this. 


Double click to open EWeaponsState. Click on the New 
button at the upper right corner of the window three 
times to create three entries. Change their display name to 
Idle, Attacking, and Reloading (Figure 15.42). 


Why? 


So why do we name it EWeaponState instead of 
WeaponState? Well, the E means it's an enum, just like we 
add BP_ in front of the blueprints, we add E here, so it is 


4 Enumerators 


se OO - 
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self-evident that it is an enum. It isa naming convention 
we try to stick with. 


Step 2: Add a EWeaponState vanableto BP - 
Weapon Base. Add a new variable called 
WeaponStateto BP Weapon Base and set the 
variabletypeto EWeaponSate. Compileand 
savethe blueprint, and you can seethat the 
default value is Idle. Click on theldle, and we 
can seea drop-down list with three options: 

Idle, Attacking, and Reloading. You can only 
select oneof theoptionsin thedrop-down list 
(Figure 15.43). 

Step 3: Create an animation notify state for the 
attack cooldown. Right click in the empty 
area of the Weapons folder and select 
Blueprint Class. In the pop-up Pick Parent 
Class window, type in AnimNotifyState in the 
search bar under the All Classes section. Select 
AnimNotifyState in the search results, and hit 
the Enter button to create an AnimNotifyState. 
This process is how we create a class inherit 
from any other existing classes. Next time 
when we do this, we will just say create a class 
derived from something. 

Namethe new blueprint ANS WeaponAttack. 

Step 4: Set up the animation notify statein the 
animation montages. Open Hlen FPS Pipe 
Attack Montage. Hoverthe cursor overthe "1" 
label of thenotifytrack under the Notif es section 
in thetimeline. Click on it and wait for a second, 
and you can then renamethistrack. Let's name 
it Attacking. Right dick on an empty area of the 
Attacking track and select Add Notify State > 
ANS WeaponAttack. A new notify got added to 
thetrack, and thistime, it has two diamond pins. 
Dragtheleft pin to the beginning of thetrack. 
Drag theother pin so that the range between the 
two pins coversthetimethat the weapon is on 
cooldown and cannot attack again. Figure 15.44 
shows our intention here. 


Weapon State 


E3923 ^n 
ALLACKING 


Reloading 





AGLRE 1543 Thedoo-comnlitdtreaun 
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Go ahead and add ANS WeaponAttack 
totheattack animation montage of the gun 
and the grenade launcher as well. 


Why? 


You could argue that we can attack again only when the 
animation isf nished. But in reality, the waiting time istoo 
long, and the player will feel frustrated by the attacking 
rate. It’s very common in many games to allow the player 
to attack again before the attack animation reaches 

the end. 


Step 5: Implement ANS WeaponAttack. Open 
ANS WeaponAttack. Go to the My Blueprint 
panel, hover thecursor on the Functions section, 
and dick Override Received Notify Begin. A 
new function called Received NotifyBegin got 
added to the Functions, and it is also opened for 
us (Figure 15.45). 

Thisfunction iscalled when theanimation 
hitstheleft pin of the animation notify state. 
Implement it as shown in Figure 15.46. 

TheMesh Comp istheskeletal mesh that 
iscurmently playing the animation. The Get 
Owner getsthe Owner of the Mesh Comp; 
in this case, it's BP Character Base we cast 
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B My Blueprint 
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it, get its CumentActiveWeapon, and set the 
WeaponState vanableto Attacking. To create 
the Set node, drag out fromthe Current Active 
Weapon and search for set weapon state. 

Go to the Functions section again, 
overridethe Received Notify End function, 
and implement it as shown in Figure 15.47. 

Thisfunction iscalled when the 
animation hitsthe right pin of theanimation 
notify state. What wedo with this function 
isto set the WeaponState variable back to 
Idle. So long story short, when the attacking 
animation starts (wherethe left pin of the 
animation notify state is), the WeaponState 
changes to Attacking. When the attacking 
animation hitsthe right pin of theanimation 
notify state, the WeaponState changes back 
to Idle. All weneed to do now isto check if 
the WeaponState is Idle or not; we can attack 
again only when the WeaponState is Idle. 


Step 6: Create a CanAttack function. Add a new 


function to BP Weapon Base and name 
it CanAttack. Implement it as Shown in 
Figure 15.48. 
Thenodethat the WeaponState variableis 
connected to is an Equal node; to create it, drag 


== Return Node _ 


Result 


Weapon State 
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out from WeaponSate and type in Equal and 
choose Equal (Enum). This nodethen retums 
true if WeaponState is Idle, it retums false if 
WeaponState is not Idle. This function retums 
true only when the WeaponState is Idle. 

Step 7: Insert a CanAttack call in the Attack event. 
Double click the EventGraph under the My 
Blueprint panel to go back to the EventGraph. 
Modify the Attack event as shown in Figure 15.49. 

What wedid hereisto check if wecan attack 
and only attack if we can. Playthegame again, 
and now we have proper weapon cooldowns. 
Again, all three weapons should work. 

Let's moveon to the attack damage. 


Tutorial 15.3: Weapon Damage 


Step 1: Pipe damage. Open BP. Pipe, go to 
Functions and overridethe Commit Attack 
Anim Notify function; if you do recall, this 
function is called when theanimation hit the 
CommitAttack animation notify. Let's go step 
by step to implement this function as shown 
In Figure 15.50. Therearea few new thingsin 
this graph. 

Createa SphereOverlapActors function 
and call it using Event Commit Attack Anim 
Notify. Create a GetActorLocation for the 


—— 
Č) For Each Loop f Apply Damage 
p> — BD exec LoopBody P» — P 
UT Arrav Array Element D 
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Sphere Pos input of the SphereOverlapActors 
node. The GetActorLocation retumsthe 
location of the Target. Self meansthe actor of 
this blueprint, orin other words, the pipe. 
Drag out fromthe Sphere Radius input 
pin of the SohereOverlapActors node 
and select Promoteto variable. A new 
variable got added to the blueprint, nameit 
DamageRange, compile, and set the default 
valueto 100. Drag out fromthe Object types 
and search and create a Make Array node. 
This node makes an array(list) of items. And 
now, it has only oneiten item 0. Set the Item 
Ofrom WorldStatic to Pawn. Weonly want it 
to overlay with pawns and ignore other types. 


Array 


Imagine that there are three weapons in the game. 

When the player picks them all up, logically, we can have 
three variables to store them: weapon 1, weapon 2, 

and weapon 3. However, there is a problem with this 
approach. What if you don't know how many weapons you 
Will need for your game? What if you have 2000 dif erent 
weapons in a game? Do you create 2000 variables? 


It makes much more sense to keep track of these weapons 
as a list of items or elements instead of separated 
individual variables. An array is a list of the same type of 
variables. Each item or element in an array has an index 
associated with it. Thef rst item has an index of 0, and the 
second one has an index of 1. The next item has an index 
of the previous item's index plus one. Every item has a 
unique index, and the index is used to query that item. 
You can add or remove an item in an array, and you can 
merge two arrays if they hold the same type of variables. 


This SphereOverlapActors needs an array of Object Types 
because it needsto know what kind of object types you 
want it to overlap with, and it can be multiple types. An 
array input or output pin has a grid-like shape instead of 
a circle. As you can see, both Object Types and Actors to 
Ignore are arrays. 


Drag out from the Actors to ignore and create another 
Make Array node. Create a GetOwner node and connect 


n Creating Genes wth Urad Engine SuostanceParte, &Maa 





it to the [0] input pin of the Make Array node. Again, the 
SphereOverlapActors needs to know an array of actors 
you want it to ignore. We only want to ignore the owner of 
the pipe, but you can add more if needed by clicking the 
Add pin button. 


You know that the Out Actors return value of the 
SphereOverlapActors node is also an array because its 
icon is a grid. Drag out from the Out Actors and create a 
For Each Loop node. 


Loop 


Whenever you want to do something multiple times, you 
can use a loop. This For Each Loop loops through every 
element of its Array input. If the array has 100 items, the 
Loop Body out execution pin f re 100 times; each time it 

f res, the Array Element output pin is a dif erent item. The 
Array Index output pin gives the index associated with 
that array element. 


Connect the Loop Body with an Apply Damage node. 
Connect the Array Element to Damaged Actor, drag out 
from the Base Damage input pin, and promote a variable 
to connect to it. Name the variable Damage and set the 
valueto 100. Finally, connect a Self node to the Damage 
Causer because the pipe itself is the causer of the damage. 


What this function does is to draw an imaginary sphere 

at the location of the pipe. It then collects all the actors 
that overlap with this sphere and apply damage to every 
one of them. The Apply Damage function is part of a 
built-in damage feature of the game engine. Any actor can 
subscribe to this event and receive damage. 


Step 2: Test the attack of the pipe. Open. BP. 
Character. Base, search, and createan Event 
AnyDamage. Call Print String with Event 
AnyDamage, and connect the Damage output pin 
totheln Sring of the Print String (Figure 15.51). 

Set the Weapon Class of the 
AcquireNewWeapon function call in the Event 
BeginPlayto BP Pipe. Drag a BP_Character_ 
Baseto the leve and play the game. After 
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getting the pipe in hand, let's get closeto 

the BP_Character_Base, press the left mouse 
button to attack, and we should see 100.0 got 
printed. 

Step 3: Gun Attack Line Tracing. Open BP_Gun and 
create an overrideto Commit Attack Anim Notify. 
Implement it as shown in Figure 15.52. 

TheLineTraceByChannel traces a line 
between the Start and the End input. It retums 
an Out Hit, which containsthetrace result. The 
owner here again isthe BP Character. Base 
that ownsthis gun. The Get Actor Eyes View 
Point is a handy function, and it gives you the 
location and rotation of the "eye" of the Target 
input. This eyeis an abstraction. If a player 
possesses the target, it retums the location and 
rotation of the camera the player is looking 
through. If an Al possessesthetarget, it retums 
the logical location and rotation of the Al 
controller. 

Weusethe Out Location (the location of 
the eye) asthe Start input. The get-forward 
vector convertsa rotation to a vectorthat 
pointsto theforward direction of the 
rotation; in Unreal Engine, it isthe X-axis. 
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Wethen multiply it with a hugef oat number, 
which makesit almost likean inf nitely long 
vector. You can createthat multiply node by 
dragging out fromthe Retum Value of the 
Get Forward Vector, type an '*" in the search 
bar, and choose vector * f oat. Weadd this 
inf nitely long vector to the Out Location as 
the End input of the LineTraceByChannel to 
indicate that we want to traceforward from 
theeye as much as possible. Again, the +node 
can becreated by dragging the Out Location 
out, typein “-F’in the search bar, and choose 
vector --vector. The rest of the code should be 
straightforward. 

Onelastthing you probably didn't 
noticehereisthat the Trace Channel is set to 
Camera. There are many prebuilt channels 
in Unreal Engine. An actor can chooseto 
respond to any channel in three dif event 
ways: ignore, overlap, or block. Thelinetrace 
only traces actors that block the channel it is 
tracing. Open BP_Character_Baseand select 
the CapsuleComponent in the Components 
panel. Go to the Details panel and f nd the 
Collision section. Expand the Collision Presets 
to view the collision responses. You can see 
that it choseto ignorethe Visibility channel 
(Figure 15.53). 

Wechangethe Trace Channel of the 
LinelraceByChannd to Camera so that the 
tracedoes not ignore BP Character. Base. 

Step 4: Apply Damage. On the other side of the 
LinerraceByChannel, wejust simply do an Apply 
Damage. Drag out fromthe Out Hit of the 
LinelraceByChannd node, search, and create 
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a Break Hit Result node. dick the downward 
arrow at the bottom of the Break Hit Result node 
to expand it. You can seethat a whole lot of 
information is collected here. Usethe Hit Actor as 
the Damaged Actor input of the Apply Damage 
node. The Damage and self node is created 
thesame way asthe pipe, but let's makethe 
valueof the Damage variable 10 instead of 100 
(Figure 15.54). 


Step 5: Add a sparkle VFX to the hit location. In the 


support f les, f nd theVFXfolder. Copy the VFX 
folder to the content folder in your game project. 
Go backto the editor, and you should seethe 
VFXfolder got added to the Content folder in the 
content browser as well. Open this VFX folder and 
you can see some VFX assets inside of it. These 
VFX assets were built with Unreal Engine's Niagra 
system. Dueto the length limit of this book, we 
can't cover how to makethem, but it takes little 
ef orttof nd sometutorials about Niagra online. 

Continue after Apply Damage, create a call 
to Spawn Systemat Location node, and set the 
System Templateto Gun Hit. The Location of 
the Break Hit Result goesto the Location input. 
Drag out fromthe Normal of the Break Hit Result 
and create a Make Rot from X. Connect the 
Retum Value of the Make Rot from X nodeto the 
Rotation input (Figure 15.55). 

Set theacquired weapon to BP Gun, play 
the game, and test it. A sparkle gets generated at 
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the hit point of the gunshot every time you shoot. 
You can also shoot the BP Hlen Baseand see 
thedamage printed at the upper left comer of 
the screen. The X-direction of the normal isthe 
normal direction of thehit point. Make Rot from 
Xgives usthe rotation of the normal; wethen use 
it astherotation for the VFX to makethe sparkles 
splash outward fromthe surface. 

Step 6: Grenade launcher grenade. For the grenade 
launcher, weneed a dif erent approach. It 
hasto throw out an actual grenade. Createa 
Blueprint class derived from Actor and name 
it BP Grenade. Add a StaticMesh component 
to it and set it to Grenade launcher. grenade. 
Drag the SaticMesh up, overlap it with the 
DefaultSceneRoot, and releasethe mouse button 
to replacethe scene root with the StaticMesh 
(Figure 15.56). 

With the StaticMesh selected, go to the 
Details panel and set the Collision Presets under 
the Collision section to NoCollision (wedon't 
want it to collide with the player when it isin the 
barrel). 


=a Viewport f Construction Scrip 


4 DN i Oo ve 


Drop here to make StaticMesh the new root. The default root will be deleted. 
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Step 7: Implement an Ignite event. Go to the event 
graph and implement a custom event called 
Ignite as shown in Figure 15.57. 

When we load a grenade, weattach (make 
it follow) it to the grenadelauncher. When we 
f re, wewant to call this Ignitefunction of the 
grenade. Thefunction f rst detaches itself (the 
Target is self) from whatever it is attached to 
and add a projectile movement component to 
it. When a projectile movement component gets 
added to an actor, it makes the actor movelike 
a projectile. There area few other movement 
components built-in in Unreal Engine, and we 
will explorethem later. 

A projectile movement component has 
a velodity variable wecan set. This velocity 
variable def nes the direction and speed of the 
projectilein theform of a vector. We want to 
beableto set thedirection of the velocity when 
calling thefunction, so we added a Fire Direction 
input to the Ignite event. Wethen multiply it with 
a promoted variable called Projectile Speed to 
specify the value of the velocity. Set the Projectile 
Speed variableto 2500. 

Theyellow Set Velocity nodeis created 
by dragging out the Retum Value of the Add 
Projectile Movement Component and search for 
Set Velocity. After setting the velocity, we enable 
the Collision of the Matic Mesh component. 

Select the Add Projectile Movement 
Component node. Go to the Details panel and 
check on the Rotation Follows Velocity and 
Should Bounce. Thesetwo settings make the 
projectilefacethe direction of its velocity and 
also enable collision (Figure 15.58). 

Step 8: Add an explosion when hit and deal damage. 
With the SaticMesh component selected, go 
to the Details panel, and scroll down to the 


J Set Collision Enabled 
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bottom to f nd the Events section. Click on the 
green button on the right of the On Component 
Hit label to create an On Component Hit 
(SaticMesh) event. This event f res when the 
StaticMesh hits anything. Implement this event 
asshown in Figure 15.59. 

When this hit event f res, wef rst check if the 
Other Actor (the actor the mesh hit) is not the 
owner of thegrenade. That!=node is created 
by dragging out fromthe Other Actor output 
pin and search for! s it retumstrueif the other 
actor isnot theowner of the grenade. When the 
Other Actor is not the owner, wecall a Spawn 
Emitter at Location function, and set the Emitter 
Templateto P Explosion and theLocation to be 
thelocation of the grenade. This code spawns 
an explosion VFXat the location of the grenade. 
Next, wecall theApply Radial Damage with 
Fallof function. Thisfunction applies damage 
with a fallof , and we set the Damage Fallof 
to L It applies damageto all actors overlap 
with a spherelocated at the Origin and has 
a radius of the Damage Outer Radius. The 
damage isthe strongest at the ongion and falls 
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of toOattheedgeof the sphere. Explosion 
Damage and Damage Rangearetwo promoted 
variables, and their values are both 200. After 
applying damage, we destroy the grenade by 
calling the DestroyActor with self asthe Target. 
DestroyActor deletes the Target out of the game. 


Step 9: Set up a grenade launch point socket. 


OpentheGrenade launcher static mesh. Go 

to the Socket Manager and click on the Create 
Socket button to create a new socket; nameit 
GrenadeLaunchPoint. Set the Preview Static 
Mesh to the grenade, move, and rotate It, so itf ts 
into the barrel nicely (Figure 15.60). 


Step 10: Preload a grenade. Open BP Grenade 


Launcher. Implement a function called 

LoadGrenadeOnSpawn as shown in Figure 15.61. 

And call itin the Event BeginPay. 
TheLoadGrenadeOnSpawn event is 

very similar to the AcquireNewWeapon 
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J AttachActorToComponent 





595 





n Greeting Greswth Urad Engine Suostance Parts; &i Vaya 


(Figure 15.8). Wespawn a BP Grenadeat the 
Grenadel aunchPoint socket and noticethat we 
set theOwnerto bethe owner of the grenade 
launcher, which should bethe BP Character 
Basethat ownsthis grenade launcher (Why?). 
Wethen promotethe spawned grenade as a new 
variablecalled Loaded Grenade and attach it 
to the Grenadel aunchPoint socket of the mesh. 
TheGrenadel aunchPoint variableis a promoted 
variable, and its valueisthesameasits name. 
Wecall this event in the Event BeginPlay, so a 
grenade should beloaded already when we got 
thegrenade launcher. 
Switch the acquired weapon of BP - 

Hlen Baseto BP GrenadeLauncher, playthe 
game, and you should seethat the grenadeis 
already in the barra. 

Step 11: Shoot the grenade. Go back to BP _ 
GrenadeLauncher and overridethe Event Commit 
Attack Anim Notify as shown in Figure 15.62. 





In this event, we f rst check if the Loaded Grenade is valid 
(we set it in the LoadGrenadeOnSpawn event). If we have 
a loaded Grenade, we get the look direction of the owner 
by calling the Get Actor Eyes View Point (we have done 
this before). We then ignite the Loaded Grenade toward 
that direction. After that, we consider that the grenade 
launcher no longer has a loaded grenade. So, we set the 
Loaded Grenade to nothing (if we don't connect anything 
to the Set node, we set the value to null). 


Play the game again and try to shoot with the grenade 
launcher. What is cool here is that the printed damage 
value is dif erent depending on the distance. You can also 
hurt yourself, which isn’t necessarily a bad thing when it 
comes to gameplay; we will keep it this way. 
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There is one more thing left for the gun and the grenade 
launcher— Reloading. Let's implement that before 
wrapping up the weapons chapter. 


When it comes to Reloading, we need to have an ammo 
system to keep track of how many ammo are in the clip 
and the inventory. Even though the grenade launcher 
only got one grenade after reloading, all the logic of 
realoading should apply to both the gun and the grenade 
launcher. So let's insert a BP Ranged Weapon class 

to generalize the Reloading for both the gun and the 
grenade launcher. 


Step 1: Createa BP. Ranged Weapon class. Create 
a new dasscalled BP Ranged Weapon derived 
from BP Weapon Base. Open BP Gun, click 
on the Class Settings button in thetoolbar, go 
to theDetails panel, and set the Parent Classto 
BP Ranged Weapon (Figure 15.63). Do thesame 
thingto BP Grenade Launcher. 

Our dasshierarchy has changed a little bit as 
shown in Figure 15.64. 

Itiscommon to have multiple layers of 
classes that the base classes take care of the 
standard stuf , and child classes implement their 
specif c feature. 

Step 2: Add variables for the ammo. Add 
three vaniablesto BBP_Ranged_Weapon. 
Ammolninventory, AmrmolnClip, and 
ClipCapadity. Maketheir variable-type integer. 

Step 3: Override Can Attack. In BP. Ranged Weapon, 
goto thefunctions and overridethe Can Attack 
function. Unreal created a new function for us 
with thesamenameand already added a call to 
the parent function (Figure 15.65). 

Step 4: Implement the Can Attack function. Hold 
down Grrl and drag the AmmolnClip to the 
graph, drag out fromit, search for “>” and 
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select integer >integer. Drag out fromthe Result 
of the Parent: Can Attack function, create an 
AND Boolean, and connect the output pin of the 
integer >integer node to the second input of the 
AND Boolean node. Finally, the output pin of 
the AND Boolean goes to the Result of the Retum 
Node (Figure 15.66). 

What wedid hereisto ensurethat two 
things haveto betrueto allow attack. First of 
all, AmmolnClip hasto be bigger than O, or 
in other words, there is ammo in dip; second, 
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whatever the parent function hasto ensure. You 
can double click to open the Parent: Can Attack 
function; it brings you to BP Weapon Baseand 
shows you what'sinsideof that function; in our 
case it checks the WeaponState. 

TheAND Boolean node only retums true If 
all inputs aretrue it retums false if any one of 
theinputs is false or if they areall false. Long 
story short, what we are saying hereisthat the 
weapon has to bein Idle state and has ammo in 
thedipto attack. 

Step 5: Implement DecreaseAmrmolnClip. Create a 
new custom event, call it DecreaseAmmolnClip, 
and implement it as shown in Figure 15.67. 

Thelogic hereis straightforward. If thereis 
ammo in the clip, renoveone. Thelast nodeis 
called a decrement node, and you can create it 
by dragging out fromAmmo in Clip and search 
with 2 “—’ (minus) characters. What decrement 
doesis se the value of the input to input —1. 

Step 6: Override CommitAttackAnimNotify. 

We should only decrease ammo when 
theattack is committed in the animation. 
Override CommitAttackAnimNotify and call 
DecreaseAmmolnCip with it (Figure 15.68). 
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Why? 


So you are probably wondering why don't we 

just move whatever in DecreaseAmmolnClip to 
CommitAttackAnimNotify? Well, Decrease Ammo may 
mean dif erent things for other weapons, and putting 

itin a custom event allows the child class to override 

this part of the game logic. This coding style is called 
encapsulation. Other than being able to override it, 
another advantage of encapsulation is clear of intention. 
The name of DecreaseAmmolnClip explains what this part 
of the code does. 


Step 7: Add parent call to CommitAttackAnimNotif y 
inthechild dass. Open BP Gun andf nd its 
CommitAttackAnimNotify. Right click on Event 
CommitAttackAnimNotify and select Add call to 
parent function. A Parent: Commit Attack Anim 
Notify got added, and insert it at the beginning 
of Event CommitAttackAnimNotify (Figure 15.69). 
Do thesamething to the BP Grenade. 
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Tryto play again, and wecannotf re 
anymore. This is becausethe ammo is 0 by default. 

Step 8: Create an UpdateUl event. We don't havea UI 
yet, but it does not prevent us from creating one 
and implement it properly later. Add an empty 
custom event called UpdateUl to BP_Weapon__ 
Base (Why?). Go to BP Ranged Weapon and 
ovemide it. For now, let's makea call to Print 
String. Drag out theln String of the Print String 
node, search, and create an Append node. Add a 
new pin to the Append node. Hold down Cin and 
drag theAmmolnClip and the Ammolnlnventory 
to thegraph. Connect AmmolnCip to the input A 
of the Append node. Connect Ammolninventory 
tothelnput Cof the Append node Typein '/" 
for input B. This will print out AmmolnClip/ 
Ammolninventory for us, so wecan quickly check 
the ammo count. Add a call to UpdateUl at the 
end of DecreaseAmmolnClip (Figure 15.70). 

Step 9: Set up the ammo variables. Open BP. Gun 
and click the Cass Defaults button in the 
toolbar. Set the Ammo in Inventory, Ammo 
in Clip, and Clip Capacity all to 5. For the BP_ 
Grenadel auncher, set the Ammo in Inventory 
to 3and set both theAmmo in Clip and Clip 
Capacityto 1. 

Playthegame again, and try to shoot. 
You can now seetheammo count got printed, 
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and you can no longer shoot if you have no 
ammo left in the clip. 

Step 10: Createthe Reload events and CanReload 
function. The Events and functionsof the 
reloading part aresimilarto the attacking. We 
need a Reload event, a CanReload function, and 
a PlayReloadAM event. But we need more notify 
events. Open BP Weapon Baseand implement 
themasshown in Figure 15.71. 

For the Can Reload function, wesimply 
makeit retum a falsein BP_Weapon_Base 
(some of the weapons do not need to reload). 
The ReloadAM isa new variableof thetype 
Anim Montage the sametype as AttackAM. 

Forthe notify events (the events we call with 
animation notif es), we have a ReoadStartNotify, 
and weset the weapon stateto Reloading with 
it. Wehavea ReloadCompleteNotify and we 
set the weapon stateto Idle with it. The others 
are weapon-specif c; for the gun, we have 
GlipDropNotify, NewCliplInHandNotify, and 
ClipAttachedNotif y. For the grenade launcher, 
wehave NewGrenadelnHandNotify and 
GrenadeAttachedNotify. They areall empty in 
BP Weapon Base. 

Step 11: Createthe reloading animation montagefor 
thegun. Go to the animations folder, f nd Ellen _ 
FPS Gun Reload, and create an AnimMontage 
with it. Open the new AnimMontage, make sure 
the preview mesh in hand isthe gun, and add the 
following new notif es (Figure 15.72): 


l. ReloadStart: Positioned at the beginning 
of the animation. 


2. ClipDrop: Positioned at the time the 
empty clip drops out. 
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3. NewCliplnHand: Positioned at the time 
that the animation has a new clip added 
to the left hand (in Maya). 

4. ClipAttached: Positioned at the time 
when the clip is pushed into the gun. 

5. ReloadComplete: At the time when the 
hands settle down, we think that the 
player can attack again. 

Wedid not bring in theclip modelsin Maya 

done bythe animators. That's why we need to 

recreatethem all in here. Ideally, the weapons 
should berigged as well with animations we 
can import. However, for the simplif cation of 
therigging chapter and theanimation set up 
here, wechoose not to elaboraterigging the 
weapons. 


Step 12: Add the sockets for the clip and the 


grenade. Go to the Skeleton tab to switch to 
theskeleton. Let's add two more sockets for the 
grenade and the clip of the gun and namethem 
GrenadeHandSocket and ClipHandSocket. We 
need thesetwo, so wecan attach them when 
reloading. Don't forget to removethe attached 
assets and then attach the asset you need to 
seeto better position the socket. And of course, 
Switch to the corresponding reload animations 
as well (Figure 15.73). 


Step 13: Createthe reloading animation montage 
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AnimMontageforthe grenade launcher, and add 
thefollowing notif es (Figure 15.74): 


l. ReloadStart: Thisisthe same asthe gun. 

2. NewGrenadelnHand: Positioned at the 
time when the new grenade pops into 
existence in the left hand when the left 
hand isof screen. 

3. GrenadeAttached: Positioned at the time 
when the grenade is loaded in the barrel. 

4. ReloadComplete: This isthe same as the 


gun. 

Step 14: Implement notif esin the animation 
blueprint. Go to the event graph of the 
animation blueprint, and implement all the 
notif es weadded in the animation montage 
here. They areall implemented thesame way as 
theAnimNotify CommitAttack. Get the pawn 
owner, cast itto BP Character Base, get the 
active weapon, and call the corresponding event 
we added in Step 10 (Figure 15.75). 

Now all our weapons can receive these 
notif es if they overridethese events. It's a bit of 
repetitive work, but wecan indeed manage. 

Step 15: Assign thecorresponding reload Animation 
montageto the weapons. The ReloadAM 
variablesarestill empty in BP Gun and 
BP_GrenadeLauncher. Assign the animation 
montages we just created to them in the Class 
Default settings. 

Step 16: Set up thereload input and Implement then 
event in BP Hlen FPS. Go to the main Ul and 
f nd Edit — Project Settings. Click on the Input 
section. In theAction mapping, let's add a new 
binding, call it Reload, and set the button under 
itto R. Goto theevent graph of BP Elen FPS, 
search and create an InputAction Reload. 
Implement the InputAction Reload as shown in 
Figure 15.76. 
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Step 17: Implement CanReload. Open BP Ranged - 
Weapon and overridethe CanReload function as 
shown in Figure 15.77. 

Weare checking threethings here. First 
of all, isthere any ammo left in the inventory. 
Second, AmmolnCip has to be smaller than 
ClipCapacity (otherwise, the dip if full, no 
need to reload). Finally, the weapon state 
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should not be reloading (we don't want to 
reload again when wearealready reloading). 
All three haveto betruefor the AND Boolean 
to retum true. 

Playthegame again, and our reloading 
should be half-working. The ammo reduces 
as expected when we shoot, and wecan 
reload by pressing Rif theclip is not full. We 
cannot reload or even shoot during reloading 
(which is good, and why?). However, the most 
important thing is not done; the ammo in the 
dip should replenish. Let's implement this 
part of thefunctionality. 

Step 18: Implement MoveAmrroToFillClip. Createa 
new custom event to BP Ranged Weapon and 
call it MoveAmmoToFillClip. Implement it as 
shown in Figure 15.78. 

Thisfunction isthef rst function that wedo 
some mathematics. Pleasetry to understand it 
yourself before continue reading, and we will 
cover it in the next paragraph. 

CipCapacity —AmmolnCip gives us how 
many ammo is needed to f Il the clip. 
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Ammolninventory >(CipCapacity — 
AmrmoinClip) retums if there is enough ammo 
in theinventoryto f Il the clip. Based on that, we 
branched out our calculation: 

If there is enough in the inventory 
(True), wetake out the number of ammo 
needed from Ammonininventory by setting 
Ammonininventory as Ammonininventory — 
(ClipCapadty —AmmolnClip). And then, we set 
theAmrmolnClipto theClipCapadtty to make 
thedlip full. 

If there isnot enough, we add what's left in 
the Amrmolninventoryto the AmmolnCip and 
set the Ammolninventory to empty. 

Thisalgorithmis not theonly wayto achieve 
this, but it is logically easier to understand. 
Figure 15.79 shows an altemativeto tacklethis. 

Wechoosethef rst one becauseit is logically 
not only easier to understand but also faster. It is 
faster becauseit does not create a new variable 
(Try Full Fill Ammo Left) and also it did not call 
a Clampfunction, which intemally costs much 
more. How much faster you ask? Twice, about 
twice asfast. 

Although weare not trying to be 
software engineers, we are just regular 
programrrers. But it is still worth noting that 
weshould always be aware of the costs of 
dif erent algorithms. It is always possibleto 
f nd altemativesthat could make your game 
run faster or dower if you are not careful. 


Step 19: Call MoveAmrmoToFillClip in 


ReloadCompleteNotify. Create an override of 
ReloadCompleteNotify, add a call to its parent 
function f rst, then call MoveAmrmoToFillClip, 
and then add a call to UpdateUl as well 
(Figure 15.80). 

Playthe gamenow, and the gun should work 
already, you can tryto reload, and it rdoads 
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and printsout the numbers nicely. The grenade 
launcher reloads and does updatethe numbers. 
However, thereis no new grenadeto f re out after 
thef rst one goes out. 

Step 20: Spawn new grenade. Open 
BP GrenadeLauncher, overridethe 
GrenadelnHandNotify event, and implement 
it asshown in Figure 15.81. 

What wedo hereisto spawn a new 
BP Grenadethesame way wedid in 
LoadGrenadeOnSpawn. Theonly dif erence here 
iswewantto attach it to the GrenadeHandSocket 
ontheleft hand of theskeletal mesh instead of 
theGrenadel aunchPoint. Wecreated a variable 
called GrenadeHandSocket, and the valueisthe 
sameasits name. 

Step 21: Attach the new grenadeto the 
GrenadeLaunchPoint when notif ed. Overridethe 
GrenadeAttachedNotify event and implement it 
asshown in Figure 15.82. 


f AttachActorToComponent 


©} Event New Grenade in Hand Notify @ SpawnActor BP Grenade P 
b-——————————— »>—»? 
lass tum Value LE Grenade in Hand 


f Get Socket Transform 
J Get Pawn Skeletal Mesh 
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GrenadeAttachedNotify is called when 
therdoad montage hit the GrenadeAttached 
animation notify. Thisisthetimethe new 
grenade is attached to the barra. So, wese the 
LoadedGrenadeto GrenadelnHand to makeit 
thenewlyloaded grenade. Wethen attach it to 
theGrenadeLaunchPoint. Wethen movethe 
ammo tof II thedip, updatethe UI, and dear 
thevalueof theGrenadelnHand variable. Notice 
that the Location, Rotation, and Scale Ruleof the 
AttachActorToComponent is Keep World; this way, 
weavoided the husde of having to match the 
GrenadeLaunchPoint and GrenadeHandSocket 
exactly. If the setingsareall Snap to Target, the 


grenade will pop when theattachment is changed. 


Play the game now, and the grenade 
launcher should havea completely working 
reload functionality. However, if you do 
recall, wedid call the MoveAmmoToCip in 
the parent dass already. Although calling it 
again heredoesnt hurt (why?), but let's go to 
BP Ranged Weapon and deleethe override of 
the ReloadCompleeNotify. 


Step 22: Createa dip actorthat automatically drops. 


Createa new blueprint class derived from Actor. 
NameitBP Gun Clip Drop and double dick 

to open it. Add a static mesh component to it 
and set the mesh to gun Gun clip. Under the 
Physics section of the Details panel, check on 
Simulate Physics. Set the Collision Presets in the 
Collision section to Custom, expand it, and set all 
responses to Ignore. Go to its event graph, add a 
call to the Delay function in Event BeginPlay, and 
set the Duration to 2. Add a call to DestroyActor 
after the Delay node (Figure 15.83). This setup 
makes it self-destruct after 2 seconds. 


Collision Enabled (Query and Physics) v. 


HE = 
2 >: 


i& | 


i B 


SSSsgegq 


Completed B — e 


AGURE 1583 Cea Gn Gip Dapdasandnaleitsdf-cisrut dte 2sxurcb 


Ta 


f DestroyActor 


rget | sé 








n Credting GermeswthU'red Engine Suostene Parte, &lVaya 





Step 23: Overridethe ClipDropNotify event. Go 
to BP Gun, and dragthegun bulletsinthe 
Components panel overthegun Gun dipto 
parent it under gun Gun dip. Overridethe 
GlipDropNotify event and implement it as shown 
in Figure 15.84. 

We parent the gun bulletsto gun Gun - 
dip so we can hidethem with one go. In the 
CipDropNotify event, wehidethegun Gun _ 
dipf rst (make surethat the Propagateto 
Children is checked on forthe Set Visibility 
node). Wethen spawn an instance of BP « 

Gun Clip Dropatthetransform of thegun - 
Gun Clip. TheBP Gun Clip Drop simulates 
physics, so it drops down right away asif it 
wasthegun Gun Clipthat wehid drops 
down. Because we set BP Gun Clip Dropto 
self-destruct after 2 seconds, we don't haveto 
do anything here. 

Step 24: Createa BP Gun Cip Full dass. Create 
another blueprint dass derived from Actor. Name 
itBP Gun Clip Full, and open it. Add two static 
mesh componentsto it: makeoneof themthe 
gun bullets and anotheronethegun Gun dip. 
Set the collision presets of both componentsto 
NoCollision. Wejust need themto bethe visual of 
thenew dip during the animation. 

Step 25: Override the NewCliplnHandNotify. 
Override the NewCliplnHandNotify event in 
BP Gunasshown in Figure 15.85. 

You should be pretty familiar with this 
pattem already. What we do here isto spawn 
aBP Gun Clip Full and attach itto the 
GlipHandSocket. Wealso promoted it to a 
new variable called CliplnHand. 

Step 26: Override the CiipAttachedNotify. Override 
the GipAttachedNotify event in BP. Gun as 
shown in Figure 15.86. 

Our intention hereis when the new 
dip isattached, weun-hideour actual dip 


4 *s DefaultSceneRoot (Inherited) 
PESE Mesh (Inherited) 
fy gun. Gun clip 
fy gun. bullet: 
4 ~ DefaultSceneRoot (Inherited) 
4 «Mesh (Inherited) 


4 £y gun. Gun. clip 


sy gun_bullets 
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©} Event New Clip in Hand Notify 
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model, and destroy the one attached to the 
ClipHandSocket. Wethen movethe ammo to 
f II thedipand update UI. 

Step 27: Refactor Reload and Attack to BP _ 
Character Base. Goto BP Character Base 
and implement an Attack and a Reload 
custom event there each of them just ge the 
CurrentActiveWeapon, and check if it is valid and 
then do Attack and Reload. Goto BP Hlen FPS 
and modify InputAction Fire and InputAction 
Reload to call the Attack and Reload event we 
just created (Figure 15.87). 
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We do thisto give our system more 
scalability. If we want the Al to attack, they can 
also call the Attack event. It is no longer only 
triggered by InputAction f reand can be called by 
other things (which wewill do in thenext step). 

Step 28: Auto reload. It would bestrangeif the 
character does not automatically reload when 
there is no ammo in the clip anymore. Go to BP_ 
Ranged Weapon, and add a new custom event 
called AutoReloadlfCliplsEmpty. Implement it as 
shown in Figure 15.88. 

It can besimply read as: if thereisno 
ammo inthedip, ask the owner to reload. 


Why? 


Why don't we just call the reload function of the weapon? 
Instead, we are getting the owner to do the reload. Well, 
because logically, it should always be the owner to do 

the reloading. What if the owner is dead? What if the 
weapon isin inventory? There are situations we haven't 
implemented yet. Having two entries to do one thing is an 
ingredient for nasty bugs. 


Step 29: Call AutoReloadlfCliplsEmptyin Event Commit 
Attack Anim Notify. Find the Event Commit Attack 
Anim Notify in BP Ranged Weapon, and adda 
call to AutoReloadifCiplsempty at the end of the 
event (Figure 15.89). 


= © Decrease Ammo in Clip © Auto Reload if Clip Is Empty 


Q Event Commit Attack Anim Notify 
D-DD bD — 2 
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Wemay want to call AutoReloadlfCliplsEmpty 
in someother places too, but for now, thisisa 
logical placeto call it. 

Alrighty, at this point, things should be 
working on a practical level. Thereis, however, 

a little bug in our current setup. Try playing the 
gamewith thegun and keep spamming the R 
button and theleft mouse button. And you will 
seethat there isa changeforthe gun to f re after 
you started reloading. Tryto f xit yourself and 
see if you can spot the problem. We'll cover the 
solution in the next paragraph. 

Thereisa chancethat the reloading is 
triggered just when the attack animation is 
about to reach Received NotifyEnd. Becausetwo 
animation montages are blending, animation 
notif esin both animation montages can all be 
triggered. The ReloadStart notify changes the 
weapon stateto Reloading f rst, but becausethe 
animation isstill blending, Received NotifyEnd 
can still f reand changed it back to idle, which 
meansthat you can attack again based on our 
CanAttack function. 

Step 30: Add state check to ANS _WeaponAttack. 
Open ANS Weapon4Attack. And go to the 
Received NotifyEnd function. Modify it to the 
oneshown in Figure 15.90. 


What we added here arethe nodesthat 
are selected in Figure 15.90. Wesimply check if 
theweapon state is Reloading; if the state is not 
reloading, wecan proceed to changeit to idle, 
but if itisreloading, we don't change it to idle. 

Play the gameagain, and the bug should 


disappear. 


Conclusion 


We have all three weapons built. They can attack, deal 
damage, reload, and auto-reload. We have carefully 
structured our classes and hierarchy so that many of the 
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common behaviors of the weapons are generalized into 
base classes. We have also used animation montages 

and animation notif esto drive the weapon behaviors, 
visuals, and game logic. We have also covered reasons for 
many of our programming choices. In every corner of our 
structure, we try to make it f exible, scalable, short, and 
elegant. 


At this point, if you want to add a new weapon to the 
game, it takes just a few stepsto implement it based on 
the foundation we have built. A good design pattem 
values consistency, extensibility, and causes the smallest 
ripple in the system when you add new features or make 
changes. However, overdoing this would cause too much 
abstraction and hard to keep track of what is going on. 
One should always be dear on what the goal is and design 
the program based on that. 


Let's move on to the next chapter and start building the 
health and damage system. 





Health and Damage 





In this chapter, we are going to work on the health and 
damage system for our game. We have built a weapon 
system, but we cannot deal with damage yet. What is 
happening now on the weapon's end is calling an apply 
damage function. However, on the receiver's part, we are 
only printing out the number of the damage. The game is 
no fun if we cannot blast anything. The good news is that 
we already have an excellent interface for us to plug in any 
health and damage system. 


Until now, we are working with an object-oriented 
paradigm with classes and inheritance. But to create our 
health system, it may not work like the weapons. Consider 
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having a bunch of dif erent things in the game that can 
be damaged: the player, a security camera, a patrolling Al, 
and a boss. These four things do not necessarily have to 

f tinto a master base class just to be able to have a health 
functionality. They just share one thing in common: they 
all take damage. 


Let's explore another way of doing OOP: Component and 
Interface. 


Tutorial 16.1: Create a 
Health Component 


Step 1: Create a health component class. Add a 
new folder called Components in the Blueprints 
folder. Create a new blueprint class derived from 
Actor Component in the Componentsfolder, and 
namethenew blueprint class BP HealthComp. 


Actor Component 


Actor components are components you can attach to an 
actor. They cannot be placed in the level by themselves 
and they die with their host actor. 


Step 2: Set up a few variables. Open BP. HealthComp 
and add two variables of thetypef oat. Name 
thef rst one MaxHealth and the second one 
CurrentHealth. Set both of their valuesto 100. 

Step 3: Subscribeto the damage system. In the 
Event Graph, create a Get Owner node. Drag out 
fromthe Retum Value of the Get Owner node, 
search for bind event to on take any damage, 
and press Enter to create a Bind Event to On 
Take Any Damage node. There is an Event input 
pin of this new node, drag out fromit, search 
for add custom event, and hit Enter to create 
a customevent. Namethe new custom event 
TakeDamage. This new event has some input 
added already. By binding it to the On Take Any 
Damageof theowner, it got called whenever 
theowner takes damage. Call the Bind Event to 
On Take Any Damagefromthe Event BeginPlay. 
In the TakeDamage custom event, wecan try 
to print out the name of the damaged actor for 
now (Figure 16.1). 
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Step 4: Test the binding. Open BP Character. Base. 
Click on the Add Component button under the 
Components panel, search, and add our new BP - 
HealthComp. Deletethe Event AnyDamage event 
we created in the previous chapter. We don't 
need it anymore becausethe BP_HealthComp is 
now binding with it. Play the game and shoot the 
BP Character Baseinthelevel, and we can see 
theBP Character. Base got printed. 

Step 5: Calculate damage. Add a new event called 
CalculateDamage. Implement it and call it with 
TakeDamage as shown in Figure 16.2. 

What we do hereisto subtract damage 
out of the CurrentHealth and damp it 
between 0 and MaxHealth. If the Value input 
of the damp nodeis bigger than the Max 
input, the Retum Value isthe Max input. If 
the Value input of the clamp is smaller than 
the Min input, Retum Valueisthe Min input. 
Otherwise, the Retum Valueisthe Value 
input. This ensuresthat after the subtraction, 
the CurrentHealth remainsin its reasonable 
range. Wedeleted the Print String and added 


© Calculate Damage 


f Clamp (float) 
Value Re 
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the CalculateDamage function call inthe 
TakeDamage custom event. 

Step 6: Add a health blueprint interface. We want 
to informtheowner when it is hurt, dead, or it 
needs to update its Ul. But the problem hereis we 
don't know who the owner is, and we want it to 
work for anyone. Let's use a new concept called 
blueprint interfaceto tacklethis issue. 

Right dick in the empty placein the 
Content Brower and select Blueprints 
Blueprint Interface. Renamethe new interface 
BPI_ HealthComp and double click to open 
it. Goto theMy Blueprint panel, and rename 
theNewFunction Oto HealthCompNotify - 
TookDamage. Go to the Inputs section of 
the Details panel and add an Actor object 
reference input called DamageCauser. 

Add two new functions by pressing 
the ^ sign twice. Nameone of them 
HealthCompNotify Dead and the other 
one HealthCompNotify UpdateUl. With the 
HealthCompNotify UpdateUl selected, go to 
theDetails panel and add a new f oat input 
called HealthPercentage (Figure 16.3). 

Let'stiethingsup before explaining this. 

Step 7: Add interface call. Go back to BP « 
HealthComp, create a RequestUpdateul and a 
CheckDeath custom event, and implement them 
asshown in Figure 16.4. 





ma My Blueprint HÀ My Blueprint 
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For the RequestUpdateUl, we usethe 
result of Current/MaxHealth to calculatethe 
percentage of the health left. The +node Is 
created by right click and searches for /; the 
one we used here isf oat/f oat. To let the 
owner know it should updateUl, weget the 
owner and called the HealthCompNotify _ 
UpdateUl interfacefunction. You can call 
interfacefunction on anything asif it hasthat 
function. CheckDeath is very similar. If the 
CurrentHealth is smaller or equal to 0 (search 
for «—to createit), wege the owner and 
call the HealthCompNotify Dead interface 
function. 

Step 8: Call RequestUpdateUl and CheckDeath in 
TakeDamage. At the end of the TakeDamage 
function, add morestuf asshown in Figure 16.5. 

Wef rst informthe owner that it took 
damageand then called RequestUpdateUl 
and CheckDeath. Whenever theowner took 
damage, we calculate it, tell the owner that it 
took damage, ask it to update UI, and tell it its 
death if the CurrentHealth is 0. 

Step 9: Add BPI. HealthComp interfaceto BP_ 
Character Base. Open BP Character. Base, and 
click on theClassSettingsin thetoolbar. Click on 
the Add button in the Interfaces section in the 
Details panel. Search and add BPI_ HealthComp 
(Figure 16.6). 
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Step 10: Make BP_Character_Basereceiveinterface 
call. After adding the interface, a new section 
called Interfaces got added in the My Blueprint 
panel. Open it and you can seeall the functions 
we created in BPlL_ HealthComp. Right click 
on each oneof them, and select implement 
function. Three new events got created; 
implement them as shown in Figure 16.7. 

FortheHealthCompNotify Updateul, 
weprint out the name of self and then the 
percentage followed by % health left. We 
timethe Health Percentage by 100 because 
its value would be ranged from Oto 1. For 
HealthCompNotify TookDamage, we just 
print out Ouch! For the HealthCompNotify - 
Dead, we destroy the actor. 

Playthegameand shoot the BP Hlen _ 
Base we placed in the scene, and wecan 
see all the correct information printed, keep 
shooting, and wecan eventually kill that 
BP Hlen Base 

Switch the weapon in BP Character base 
in the Acquire New Weapon function called 
in Event BeginPlayto BP Grenadel auncher. 
Try to shoot our own feet (shoot downward), 
and weshould beableto kill ourselves with 
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the grenade. If wewant anything to take 
damage, we simply add BP HealthComp 
and BPI. HealthComp, and implement these 
functions. Moreimportantly, if we want the 
wholehealth systemto work dif erently, we 
modify BP HealthComp, and everyone got 
thenew update. 

Westill have many problems. The 
character does not react when hit, and 
when the character is killed, it just pops out 
of existence. Having somehit and death 
animation would benice. Also, when the 
character is gone, the weapon stays. Wehave 
never told the weapon to die with its owner. 


Tutorial 16.2: Character 
Hit and Death 


Step 1: Createa hit react animation. J ust likehow 


wecreatethe weapon switch animation, let's 
create a quick hit animation that does nothing 
morethan a ten-frame body bend back. Make 
surethat it has only one key frame, and set 

it to additive. Call it Ellen Hit, and makean 
animation montage out of it which can becalled 
Hlen Hit Montage (Figure 16.8). 


Step 2: Test the hit animation montage. Go back 


to Elen Character Base, and changethe 
implementation of Event HealthCompNotify_ 
TookDamageto Figure 16.9. 
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What wedo hereis asking the mesh 
to play an animation montage. Anew 
parameter called HitAM set to our new hit 
animation montageis used forthe Montage 
to Playinput. Playthe game again, hitthe 
enemy with the gun, and you can seethat the 
animation got played nicely. 

Let's havesomefun and makean Al that 
shoots forward blindly, so wecan test the hit 
ef ect on the player. 

Step 3: Create a dummy Al. Create a child blueprint 

class of BP Character. Baseand nameit 
BP Dummy Al. Open it and f nd the Event Tick. 
This Tick function is called everytimethe game 
updates and call Attack with it, which makes 
this dummy Al shoot forward as fast as possible 
(Figure 16.10). 

Replacethe BP Character Baseinthe 
level to BP Dummy Al, and rotateitto make 
it facethe player. Play the game and facethat 
BP Dummy Al, and shestartsto shoot you 
asfast as possible after getting the gun. She 
even reloads, which is pretty cool. But there 
isonething strange here: if you hit her a few 
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times, shestops shooting. You would think 
that she is out of ammo, but that can't be 
the case because you have the same amount 
of ammo, and you know it takes one round 
of rdoading to run out of ammo. So what is 
going on here? Tryto f gureout the reason 
before moving on. You don't haveto f x it yet. 
Well, it’s because of the hit montage. Any 
new montagef red overrides the previous one 
in the same group, and all of our montages 
usethe default group. The hit animation 
montage overrides the shoot montage, which 
makesthe shoot montage stop prematurely 
and that causesthe ANS WeaponAttack 
never reach to the end notify to change 
the WeaponState back to idle. Wecan f x 
thisissue by assigning thehit montageto a 
dif erent group and slot. 

Step 4: Create and assign a new group and slot to 
the hit animation montage. Open Hlen Hit 
Montage, and go to the Anim Slot Manager on 
thelower right comer of the window (it might 
beshuf ed behind the Asset Browser). Click on 
theAdd Group button and typein Reaction 
asthenew group name. A new group called 
Reaction gets added to the Slot Namelist. With 
(Group) Reaction selected, click the Add Slot 
button to add a new slot to it and typein Hit 
asthesot name. Finally, go to thetimeline, 
under the Montage section, dickthetiny drop- 
down triangle button of the DefaultGroup. 
DefaultSlot, and select Slot Name Reaction. 
Hit (Figure 16.11). 

Step 5: Add the slot to the animation blueprint. Go to 
the AnimGraph of the animation blueprint. Add 
a new Slot 'DefaultSlot' and insert it between 
theold Slot 'DefaultSiot' and the Out Pose node. 
With this new slot selected, go to the Details 
panel and set the Slot Nameto Reaction.Hit 
(Figure 16.12). 
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Playthegameagain, and you can see 
that thehit animation montage does not 
overridethe other animations anymore. 
Animation montagesthat havedif erent 
groups do not cancel each other. 

Step 6: Createthe death animation montage. Find 
theDealth From The Backanimation, create 
an animation montagefromit, and keep the 
default name. Open the new Dealth From The - 
Back Montagein the Details panel and check 
of theEnable Auto Blend Out under the Blend 
Options section. We don't want it to blend back; 
that would makethe character stand up again. 

Step 7: Create a SartDeathSequence custom event. 
Go backto BP Character. Baseand createa 
function called StartDeathSequence. Implement 
theevent as shown in Figure 16.13. And call it 
after Event HealthCompNotify Dead. 

First of all, we connect it to a Do Once 
node, and the Do Oncenode only allowsthe 
execution to go through it once. It makes 
sense because, well, you only die once. 

Wethen askthe Mesh to play thedeath 
animation montage, and the DeathAM is 

a new variable set to Dealth From The 
Back Montage. Then we ge the length of the 
death animation montage, and wait for how 
long thelength of the animation montage 


f Delay f Des f DestroyActor 
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isto wait for it to f nish. Then it destroys all 
attached actors before destroying itself. 
Playthegame again and keep shooting 
the dummy character. However, when the 
character is dead, surprisingly, nothing 
happens, and the character will keep 
shooting and f nally disappears. Well, it is 
becausethe character never stops attacking. 
And the attack animation montage again 
cancels the death animation montage. To 
f xit, wehaveto prevent attacking if the 
character is dead. 


Step 8: Create a CanOperateWeapon function. Add 


a new function to BP Character. Base, and name 
it CanOperateWeapon. Implement it as shown 
in Figure 16.14 and insert it with a branch at the 
beginning of the Attack and Reload event. 
Thefunction is relatively straightforward. 
Wecheckthe health and make surethat it is 
not 0 (not dead). Play the game again, and 
thistime, when thecharacter is out of health, 
it playsthe death animation and disappears 
afterward. When the character islying on 
theground, if you hit it again, thereis still hit 
reaction, and you can keep it this way if you 
want. Or, you can prevent it by stop sending 
TookDamage interface calls if the health isO 
in BP_HealthComp. 
Step 9: A little refactoring. Think about what we 
have doneso far, and there is onething worth 
modifying. The Do oncedoes its job nicely to 
prevent thedeath sequence from happening 
again. But should it bein BP Character Base 
or should it beinthe BP HealthComp? Wall, 
if you want this dead only once behavior to 
happento all your objectsin the game, then 
putting itin BP HealthComp makes more 
sense. Otherwise, you haveto add Do Onceto 
all thedeath functions. Let's removeit from 
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StartDeathSequence and add it to CheckDeath 
asshown in Figure 16.15. 

Refactoring like Step 9 is essential and often 
overlooked by beginners, what a function should 
be called, what should it include or not, takes 
much consideration to decide. 

Let's moveon to make the player's death 
sequence as well. 

Step 10: Player character death pawn. Forthe player, 
we want to switch to a top-down view and see 
thefull body of thecharacter playing the death 
animation as well. Create a new dass derived 
fromPawn and nameit BP Player Death Pawn. 
Add a Skeletal Mesh component to it. In the 
viewport, rotatethe mesh to make it facethe 
X-axis and moveit down 150 units. Go to the 
Details panel and set the Skeletal Mesh to Hlen _ 
Skeletal Mesh. Under the Animation section, 
changethe Animation Modeto Use Animation 
Asset, and set the Animation to Play to Death _ 
From_The_Back. Check of the Looping under 
the Animation to Playas well (Figure 16.16). 


Why? 


Why do we move it down 150 units? Well, when the player 
character is dead, we want to spawn it. At that point, the 
only position we can use is the player controllers position, 
which is about that much above the ground. 


Step 11: Set up a camera. Select the 
DefaultSceneRoot in the Components panel. 
Add a Spring Arm component and a Camera 
component. Makesurethat the camera is 
parented under the spring arm. Rotatethe spring 
armupto —60 degreeson the Y axis, and moveit 
up 50 units (Figure 16.17). 
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Thesprint arm component isa special 
typeof component that movesthe attached 
component in front of any collisions. The 
spring arm ensuresthat the camera does 
not end up on the other side of the walls. We 
moveit up 5Ounitsto prevent it from colliding 
with theground. 

Step 12: Set up a player controller. Create a new dass 
derived from PlayerController and nameit BP - 
Hlen FPS PlayerController. Click on the Class 
Defaults button in thetoolbar, go to the Details 
pane, and check of the Auto Manage Active 
Camera Target option. In the Event Graph, nght 
dick, search, and create an Event On Possess and 
an Event On UnPossess. Thesetwo events are 
called when this player controller possesses and 
unpossesses a pawn. Implement them as shown 
in Figure 16.18. 

Wechecked of theAuto Manage Active 
Camera Target to allow usto set the camera 
transitions in whatever way we want. When 
We possess a pawn, we want to set the view 
target to the Possessed Pawn. When the player 
character is dead, the player controller triggers 
the Event OnUnPossess; in there, we spawn a 
BP Player Death Pawnatthelocation of the 
player controllers viewpoint (Get Actor Byes View 
Point). However, the rotation is only the yaw 
rotation of the viewpoint (wedon't want the 
spawned BP Player Death Pawntotilt or pitch 
in any way). 

After creating the new BP Player Death _ 
Pawn, we se the view target to the new pawn. 
However, thistime, in that Set View Target with 
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Blend function, we set the Blend Timeto 1, Blend 
Functo VTBlend Easein Out, and the Blend Exp 
to 1to havethe camera blend to thetarget with 
easein easeout ef ect. Finally, we possessthe 
new BP Player Death Pawn. 

Step 13: Override SartDeathSequence and set 
thePlayerControllerClass in the game mode. 
Open BP Hlen FPS, and in the Event Graph, 
overridethe StartDeathSequence just to destroy 
all attached actors and the destroy self. Go to 
Blueprints/GameModes/, open GM Hlen FPS, 
and set the Player Controller Class Under the 
Classes section to BP Hlen FPS PlayerController 
(Figure 16.19). 

Playthegame again and let the dummy 
Al shoot you. When you die, you will see 
yourself playing the death animation and 
smoothly transitioned to a third-person view. 
Thegame would betoo hard if thereis no 
wayto regenerate health; let's quickly create 
a health regeneration actor. 


Tutorial 16.3: Health Regeneration 


Step 1: Create BP. HealthRegen and set up its 
visual. Go to the Blueprints folder, and create 
a newfolder called HealthRegen. Inside of 
HealthRegen, createa new blueprint dass 
derived from BP Triggerable. Namethe new 
dassBP HealthRegen. Open BP. HealthRegen, 
add a static mesh component to it, and set the 
mesh tof oor circles f oor circle deco OL Add 
two Cube Componentsto it, scale, and rotate 
themto createa 3D crossf gure. Drag one of 
thecubeson to theother oneto parent it to the 
other one, and renamethe parent cube Cross. 
Set theCollision Presetsto NoCollision on both 
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cubes. Go to StaticMeshes/Shared, create a new 
material instance of Emmisive Base Mtl, and 
namethe instance HealthRegen Cross Mtl Inst. 
Movethis material instanceto the HealthRegen 
folder. Makeit green, and assign it to the cubes 
of BP HealthRegen. Figure 16.20 snows thef nal 
visual of the setup. 

Step 2: Make the Cross rotate. Go to Event Graph, 
f nd Event Tick, and add the code shown in 
Figure 16.21 at the end of Event Tick. 

Event Tick is called on every frame, which 

is also every timethe game updates. The 
Delta Seconds isthetime it took between this 
frameand the previous frame. It usually is 
a very small number becausethe game has 
to update around 60 frames per second. We 
multiply it with 200, make a rotator out of 
it, and add that much rotation to our Cross. 
Rotator is a typethat represents a rotation. 
Drag a BP HealthRegento theleve, playthe 
game, and you should seeit spin nicely. 

Step 3: Add regeneration functionalityto the 
BP HealthComp. Open BP HealthComp, add 


4 *$ DefaultSceneRoot (Inherited) 
Trigger (Inherited) 
4 Ñ Cross 
§) Cubel 


fy StaticMesh 





a new function called RegenerateHealth, and 
Implement it as shown in Figure 16.22. 
Thisfunction takes a f oat input called 
Amount and retums a boolean called Regen 
Successful. We check if the health is full 
(CurrentHealth =MaxHealth). If the health 
isfull, retum false. If the health is not full, 
add the Amount input to CurrentHealth, 
damp it, so it does not become bigger than 
MaxHealth, and set it. Don't forget to request 
to updateUl, and retum true. 


Step 4: Implement a Consumed custom event. 


Implement a new custom event called consumed 
in BP HealthRegen and implement it as shown 
in Figure 16.23. 

This event takes an Actor object 
reference asinput called Consumed By. When 
consumed, we hide our Cross and set Trigger 
notto collide, which disablesit. Wethen 
spawn an NS Healed VFXattached to the 
root component of the consumer. 
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Step 5: Override Overlapped event. Overridethe 

Overlapped event as shown in Figure 16.24. 
What wedo hereisto get theactor's 

BP HealthComp by calling Get Component 

by Classand set Component Classto 

BP HealthComp. Thisfunction f ndsa BP - 

HealthComp (if thereis any) and retums it. We 

then call the RegenerateHealth function of 

theBP HealthComp. Forthe Amount input, 

we generate a random number from 10 to 50 

to makethe gameplay more unpredictable. 

If the regeneration is successful, wethen call 

the Consumed event we implement earlier. 

Playthegameagain and take some damage. 

You should now be ableto consumethe 

BP HealthRegen (Figure 16.25). 

Step 6: Makeit go back after 10 seconds. At the end 
of our Consumed event, add the code shown in 
Figure 16.20. 

What wedo hereis Delay for 10 seconds 
and set our Cross and Trigger back to normal. 
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Givethegame another go, and now you 
can consume it when you take damage it will 
go back again after 10 seconds. 


Conclusion 


We have now f nished the health, damage, health 
regeneration, and death of the characters. A critical 
takeaway from this chapter is the component and 
interface paradigm, which of ers more f exibility than 
classic inheritance-based OOP. Things are getting more 
Interesting as we go. However, we still have much to cover, 
one of the essential parts of the game is the inventory and 
the UI; let’s move on to that in the next chapter. 
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A game is hard to play if there is no UI to tell you the 
current status of your health, weapon, and ammo. And we 
f nally have enough to start building an inventory system 
and a Ul. In the meantime, we will also cover short cuts to 
switch weapons. A well-designed UI makes the player's 
experience more enjoyable. In contrast, a bad UI makes 
the player smash their controllers or keyboard. We are 
going to try to make the UI simple to understand and easy 
to read. 


But before we dip into that, we need to have a weapon 
pick up and an inventory system. Let’s jump into that 
right away. 
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Tutorial 17.1: Weapon Pickup 





Step 1: Refactor the Mesh of the weaponsinto a 
variable. It is not possibleto accessthe meshes of 
a weapon dassin the Blueprint level, and it'san 
excellent opportunity to leam the construction 
script. 

Open BP Weapon Base. Add a new 
variable called Visual and changeits variable 
typeto Static Mesh object reference. Go to 
the Variables section of the My Blueprint 
pane and dickonthelittle closed eye icon 
to makeit open. Go to the Functions section 
in the My Blueprint panel and double click to 
open the ConstructionScript. Implement the 
Construction Script as shown in Figure 17.1. 

Theconstruction script is called when 
theobject is being created, but not spawned 
yet. What wedid hereisto set the Mesh of the 
weapon to the value of theVisual variable we 
added. This way, wecan set and accessthe 
mesh used by the weapon through this Visual 
variable. 

Thelittle eyeicon of thevariablesistheir 
access specif ers. If the eye is closed, the child 
class cannot accessit, and if they arenot, 
then the child class can access them. When 
the eye is closed, we call this variable private; 
when it is open, we call it public. 

Step 2: Set the Visual variables of thethree weapons. 
Open BP Gun, and you can seeits model 
disappear. Go to its Class Defaults (by dicking the 
Class Defaults button on the Toolbar and go to 
the Details panel). Set Visual to gun Gun bogy. 
Set the other two weapons accordingly. 

Step 3: Createa BP Weapon Pickup dass. Createa 
new blueprint dass called BP Weapon Pickup 
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derived from BP Triggerable. Give it a StaticMesh 
component and a RotatingMovement 
component. Add another variablecalled 
WeaponClass, makethis variable a BP Weapon - 
Base dass reference (not object reference), 
and make the WeaponClass variable public. 
Implement the construction script as shown in 
Figure 17.2. 

What we do here is once we know the 
weapon class, it gets the Visual variable 
of the weapon dass by calling Get Class 
Defaults, and use it asthe SaticMesh. The 
RotatingMovment component makes it 
rotate. 

Step 4: Test the visuals. Drag a copy of BP Weapon . 
Pickup into the level in the Details panel and set 
the Weapon Classto BP Gun, and you can see 
that it now showsthe model of the gun. Hold 
down Alt and drag to havea copy of it; thistime, 
set the weapon class to BP Grenadel auncher, 
drag out another copy, and set itto BP Pipe. You 
can see how our setup allows usto changethe 
visual of the pickup by changing the weapon 
dass. Play the game, and you can seethat they 
arerotating (Figure 17.3). 

Step 5: Add a Weapons variable. Go to BP « 
Character. Base, and add a variablecalled 
Weapons. Set thetypeof Weapons to BP « 
Weapon Base, dick on the button on theright 
sideofthe Variabletypeto pull down a drop- 
down list, and select theone with an icon that 
has a 3 x3 boxes. This Weapons variable is now 
an array of BP Weapon Bases (Figure 17.4). 

Step 6: Add thenew weapon acquired to the 
Weaponsarray. Find the AcquireNewWeapon 
function. At the end of the event, create an 
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ADDUNIQUE (add unique) node. Drag the 
Weapons variable fromthe Variablesto thef rst 
input of the ADDUNIQUE node. Drag out from 
thereroute nodethat goesto the New Active 
Weapon input of the Switch Active Weapon to 
node and and connect it to the second input of 
theADDUNIQUE node. Finally, connect the out 
execution pin of the Switch Active Weapon to 
nodeto the in execution pin of the ADDUNIQUE 
node (Figure 17.5). 
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The Weapons variableis an array of 
BP Weapon Bases, and the ADDUNIQUE 
nodeadds an itemto it. What wearedoing 
hereisto add the new weapon spawned to 
the Weapons array. 


Step 7: Createa check function to seeif wehavea 


fe Has Weapon Type 


weapon already. When we pick up weapons, 
we need to know if wehavethat weapon 
already; if wedo, wedon't want to acquirea 
new one. We may pick up the ammo, but not 
havea new weapon. Add a new function called 
HasVWVeapon Type and implement it as shown in 
Figure 17.6. 

What wearetrying to check hereis if we 
havea weapon that hastheclass type of the 
weapon class already. Or in other words, if we 
have this type of weapon already. 

This function takes a BP Weapon Base 
dass reference as an input and retumstwo 
outputs. Thef rst output is a Boolean that 
showsif wealready havethetypeof weapon 
or not. The second output retums the weapon 
that wealready have. 

Westart by using a foreach loopto loop 
through all the elements Weapons have. 
Because we add every new weapon we 
acquired to this Weapons array in Step 7, we 
arelooping through all theweapons wehave. 
Then, in the Loop Body, we check the class 
of theelement against the input; if they are 
the same, then wehavethis type of weapon 
already. Weretum with a Result of true along 
with the weapon that hasthesame class 
type. Any Retum node causes the whole 
function to retum, meaning that thef rst time 
we encounter a class-type match, we stop the 
function and retum. 
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If all the elements (weapons we have) are 
compared without a match, then wedon't 
havethistypeof weapon, and the execution 
reachesto the Completed execution pin. We 
retum with a false Result and noneforthe 
Existing Weapon. 

Step 8: Implement WeaponPickupOverlapped. 
Createa new function called 
WeaponPickupOverlapped. Implement it as 
shownin Figure 17.7. 

Thisoneis relatively simple, well, afterthe 
heavy lifting jobs done by HasWeaponlype. 
Thelogichereis when weoverlap a weapon pick 
up, we check if we have a weapon of the weapon 
class type already. If we don't haveone, then we 
move on to the AcquireNewWeapon event. If we 
haveone, weprint out a message says: | havethis 
already. 

Step 9: Implement the overlap event in BP Weapon _ 
Pickup. Open BP Weapon Pickup and override 
theOverlapped event as shown in Figure 178. 

What wedo hereis also simple; wecast the 
other actorto BP Character. Base. Wethen 
call its WeaponPickupOverlapped and usethe 
WeaponcClass variable asthe Weapon Class 
input. If the retum value is true, then the weapon 
is picked up; we destroy this pickup. 

Wecan now playthe game, and you should 
beableto pickup the weapons. Thisis pretty 
exciting! However, if you start with a gun, then 
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you cannot pick up the gun again. Instead, it 
prints out: | have this weapon already. Also, 
thenew weapon you picked up becomes your 
active weapon, and you cannot changeit back 
(good luck if you pick up the pipe at last). There 
is another bug; if you arereloading and you pick 
up another weapon, thedip or the grenadein 
your hand might not get destroyed. Let’s tackle 
theseissues one by one. 

Let's makethe weapon replenish ammo 
when trying to pick an already existing weapon. 


Step 10: Implement ReplenishAmmo functions. In 


BP Weapon Base createa new function called 
ReplenishAmmo, makeit retum a boolean, and 
set the retum valueto false. Goto BP Ranged - 
Weapon, and overrideit as shown in Figure 179. 

In the basedass, we implement it as an 
empty function that retumsfalse, and this 
assumesthat the default behavior of a weapon 
isnot replenishable. But forthe ranged weapon, 
we want to replenish ammo, so we ovemide it. 

In BP Ranged Weapon, weget the 
class of the weapon, get the default values 
of theAmmolninventory and AmmolnCi p 
variable, and add themto our current 
weapon's Ammolninventory. We also call the 
AutoReloadifCiplsEmpty and Updateul (they are 
all reasonablethingsto do after changing the 
ammo). Finally, weretum trueto indicatethat 
the replenish is successful. 


Step 11: Tweak the WeaponPickupOverlapped 


function. Go back to BP Character Base and 
tweak the WeaponPickupOverlapped function 
as shown in Figure 1710. 

Here, wereplaced the Print String nodewith 
calling the ReolenishAmmo function of the Existing 
Weapon retumed bythe HasV\eapontype function. 
Let’sexamineour entire pickup logic here: 

So whenever we overlap with a pickup, 
we check if we havethetype of weapon the 
pickup of ers. 


BP Weapon Base 
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If wehaveone, we call ReplenishAmmo on 
that one if it can replenish, reum true if not, 
retum false. 

If we don't haveone, weacquirea new 
weapon. 

Playthegameagain, and now wecan 
reolenish ammo when picking up an already 
existing weapon. 

Wehavef nished the weapon pickup 
dass. Let's moveon to our weapon switch. 


Tutorial 17.2: Weapon Switching 


All of our weapons are stored in the Weapons array. So our 
weapon switch should be working around that. 


Step 1: Implement SwitcHToNextWeapon. Go to 
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BP Character Base Create a new custom event 
called SwitchToNextWeapon. Implement it as 
shown in Figure 17.11. 

We have covered array, its elements, and 
index. Let's revisit array one moretime before 
explaining thefunction: 

An array isa container that hasa list of 
eementsin it. Every element in an array hasa 
uniqueindex number associated with it. Thef rst 


© Switch Active Weapon to 
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© Target | self] 
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element in an array has an index number of 0, 
and the second hasan indexnumber of 2. The 
next one in the list has an index of the previous 
one’s index +L. You can ask for an element by 
providing the index through the GET function. 
You can add new element to an array by calling 
ADD, and the new element is added to the last 

in thelist. You can f nd an element'sindex by 
calling the FIND function. Every array hasa 
length. Thelength of an array equalsthe number 
of elements an array has. You can ask the length 
of an array by calling the LENGTH function. The 
index of the elements starts with O and keeps 
incrementing without skipping any numbers. 
Theindex of thelast element is guaranteed to be 
thelength of the array minus 1 (why?). 

Backto our custom event. First of all, we 
check if wehavea current active weapon; if we 
don't, well, we don't have a weapon at all (the 
systemis set to equip a weapon as soon as you 
got it). Then wecalled a FIND function to f nd 
theindex of the CurrentActiveWeapon in the 
Weaponsarray. We add oneto the index, which 
in theory should betheindexof thenext onein 
thelist. But consider this: 

What if CumentActiveWeapon isthelast one, 
thereis no next one! We want to go backto the 
f rstoneon thelist. 

To ardeback to thef rst one, we used a little 
mathematic trick here, the % (Modulo) operator. 

The% operation retums the remainder of 
the division of thetwo inputs. If thelength of the 
array is N, then thelast index should be N —1. 
Wecantryto imagine how each remainder of 
index/N is: 


0-N-ORO 
1-N-ORI1 

2-N- OR2 

(9 
(N—1)+N=ORN-1 
N+N=1RO 


As you can see, thelast one cirdes back to 

0. This algonthmis what we areusing in the 
code. So, after adding oneto theindex of the 
CurrentActiveWeapon, we createa % (right click 
and search %, chose integer). We Modulo it with 
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thelength of the Weapons arrayto ensurethat 
the number circles back to 0 after the last index 
is reached. After that, we usethe GET function 
to get the dement of thecalculated index and 
call SwitchActiveWeaponTo to switch to that 
weapon. 

Step 2: Implement Switch ToPreviousWeapon. 

Create another custom event called 
Switch ToPreviousWeapon and implement it as 
shown in Figure 17.12. 

Thisonef nds the index of the 
CurrentActiveWeapon, and subtract that by 1. 
After that, we check if the value is smaller than 0; 
if it is, then the current one isthef rst one, and we 
want to moveto thelast one. The Blueprint array 
has a convenient function to get the last index 
(LAST INDEX). We usethat to get the last element 
and switch to it. Ifthe subtraction isnot smaller 
than O, then wearestill in the middle of thelist; 
usethe value of the subtraction asthe index for 
the previous one. 

Steps 1 and 2 arefunctions we do 
algorithms, and these arethe harder things to do 
in programming. You want themto be accurate, 
but you also want to makethem run fast. What 
wehaveseen arethe simpler ones; much- 
complicated algorithms are used in thelower 
level of thegame engine. 

Step 3: Key binding. Go to Edit > Project Settings. 
Find the Input section. Under the Bindings, add 
two moreAction Mappings. Nameoneof them 
Next Weapon, and use Mouse Wheel Up asthe 
input; nametheother one Previous Weapon, 
and use Mouse Wheel Down astheinput. Open 
BP Hlen FPS, and implement two input actions 
asshown in Figure 17.13. 

Playthegame again, and now you can 
usethe mouse wheel for cyding through your 
weapons. 
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©} Switch to Previous Weapon 


Ce pM 3 
Released D) 


Key 
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Step 4: Give weapon shortcuts. Open BP Weapon - 
Baseand add a new variable called Shortcut. 
Set thetypeof the Variableto Key and make 
it public. Compile and save. Open BP. Pipe, 
goto theClass Defaults, and set the Short 
Cutto 1. ForBP Gun, wecan set itto 2. For 
BP GrenadeLauncher, we can set it to 3. These 
key settings areall arbitrary, and there are many 
keys in the drop-down list, and you can set it to 
any key. 

Step 5: Implement ShortcutWeaponSwitch. Go 
back to BP Character Base. Implement a 
custom event called ShortcutWeaponSwitch 
(Figure 17.14). 

This ShortcutWeaponSwitch event has 
an input of type Key. Weloop through all the 
weapons and check if their Shortcut isthe same 
asthe Short Cut Key input. If wef nd a match, we 
Switch to that weapon. This For Each Loop with 
Break works just like a For Each Loop. However, 
it has a Break in execution pin; when that pin 
iscalled, theloop stops immediately. What we 
did hereis connect the out execution pin of the 
Switch Active Weapon to nodeto the Break in 
execution pin of the For Each Loop with Break 
node. Then we double click on the connected 
lineto add two more reroute nodes, and drag 
then down to create a clear circle back loop. Our 
intention here is whenever wefound a match, 
stop the loop. 


= 
C) For Each Loop with Break 
| Exec Loop Body > 
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Step 6: Set up the input. Goto BP Hlen _ 
FPS, create an Any Key node, call 
ShortcutWeaponSwitch with it, and connect the 
Key output pin to the Short Cut Key input of the 
ShortcutWeaponSwitch node (Figure 17.15). 

Playthegame again, and now you can use 
the shortcut you set up to switch to dif erent 
weapons. 

Step 7: Weapon switch cooldown. We can keep 
doing the switch if you spamthe keyboard, 
we want it to befast, but not inf nitely 
fast. Go BP Character. Baseandf ndthe 
SwitchActiveWeaponTo custom event, let's 
modify itto theone shown in Figure 17.16. 

First, before we even do anything, we 
check if this weapon we want to switch to is 
already the CumentActiveWeapon. If it is, we 
do nothing. Second, weadded a Do Once 
nodeto block the constant input. At the end 
of thefunction, we added a Delay node, and 
the Duration istaking the value of a new f oat 
variable called WeaponSwitchinterval. We set 
the WeaponSwitchlnterval to 0.25, which means 
after 0.25 seconds, the Delay Completes and 
callsthe Reset of the Do Once. When you Reset 
a Do Once the Do Once resets and allows the 
execution to go through it one moretime. 

Givethe gameanother run, and you can no 
longer switch weapons asfast as possible. The 
Switch now has a 0.25 second cool down. 


- €» Shortcut Weapon Switch 


$ Any Key 


Pressed B — D 
Released [> Target 


Key Short Cut Key 
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Tips and Tricks 


Sometimes, the child class does not update the vanable 
when you change the parent class. Make sure you check 
the variables like WeaponSwitchinterval in BP Ellen FPS if 
things do not seemto work. 


Step 8: Disable weapon operation when switch. We 
can easily disablethe other weapon activities by 
adding a limitation in the CanOperateWeapon 
function. Let's promotethe weapon 
switching animation montage played in the 
SwitchActiveWeaponTo to a new variable, and 
call it WeaponSwitchAM. Wecan then go to the 
CanOperateWeapon, and add somechanges as 
shown in Figure 17.17. 

In CanOperateWeapon, we check what 
animation montageis playing by calling the 
Get Current Montagefunction, and wethen 
check if it isthe WeaponSwitchAM. If weare 
playing the WeaponSwitchAM, that meansthat 
weare switching weapons, and wedon't want 
to operate the weapon. So we use! —to check 
against it and use AND to combine it with the 
previous criteria. 

Step 9: Reset Weapon state. Every time we switch a 
weapon out, we are not sure what is its weapon 
state. When we switch a weapon back, we 
shall set the weapon state back to idle. Add 
a new custom event called Activated in the 
BP Weapon Base and set the weapon stateto 
Idlethere. Call the Activated event after the On 
Completed execution pin of Play Montage node 
at the end of the SwitchActiveWeaponTo event 
(Figure 17.18). 

TheOn Completed out execution pin of 
thePlay Montage nodeis called when the 
animation montage reachesto the end. It is a 
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good timefor usto set the weapon state back 
to idle by calling the Activated event. 

Step 10: Auto-reload after weapon switch. We also 
want the auto-reload to happen when we switch 
weapons. Goto BP Ranged Weapon, override 
the Activated event wedid in the previous step, 
and add a call to AutoReloadlfCliplsEmpty after 
calling the parent function (Figure 17.19). 

Step 11: Clean up the visuals when switching. 
Forthegun and the grenade, if we switch 
to another weapon during the reloading 
process, we want to clean up the attached clip 
and grenadein theleft hand. Go to BP. Gun 
and BP Grenadel auncher, and overridethe 
Weaponlninventory event to destroy these 
attached actorsif they exist (Figure 17.20). 


—————— E — —— HIP © Auto Reload if Clip Is Empty 
© Event Activated Q Parent: Activated | 


> — 4 > — 4 D 
© Target [ self | 
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bD- D > — BD Exec IS EINE 3 
L Input Object Is Not Valid D hs b 


f DestroyActor 


LEE 
BP_Gun Clip in Hand @— @ Target 


© Event Weapon in Inventory €» Parent: Weapon in Inventory ? Is Valid 


i í f DestroyActor 
è — p | i MOS WECM 2 


DA @ input Object Is Not Valid [> E D 
| 
BP GrenadeLauncher Grenade in Hand »————— — — — ——— —————————— ——— Target 
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Wedid almost the samething in the 
two weapons. In BP_Gun, wedestroy the 
Clip in Hand variableif it does exist. In BP - 
Grenadel auncher, we do that to the Grenade 
in Hand variable. 

All right, wehavereached a point that 
wehavereasonably good inventory and 
weapon switching. Therearethingshere and 
therethat wecould do more refactoring. But 
considering the length of this book, we decide 
to leave you to do more cleanup if you want. 

Let'smoveonto theUl. 


Tutorial 17.3: Create the 
In-Game Weapon UI 


Step 1: Create a Master UI class. Go to our WBP 
folder, and create a new Widget Blueprint. Name 
the new blueprint WBP Master. 

Step 2: Add a widget switcher. Open WBP Master. 
Goto the Palete panel, open the Panel section, 
drag a Widge Switcher to the Canvas Panel of 
theHierarchy panel, and namethe added widget 
switcher to UI Switch (Figure 17.21). 


Widget Switcher 


Typically, when we play a game, there are two sets of Uls: 
a playing Ul and a pause UI. If we put them under a widget 
switcher, we can quickly switch to one of them. 


Step 3: Add two Canvas Panels: Drag two Canvas 
PanelstotheUl Switch; nameone of them 
Playing and theother one Pause (Figure 17.22). 


Canvas Panel 


Canvas Panel is a regular canvas for you to place any UI 
elements in it. If you look close, the parent of the Ul_ 
Switch (the default one added in there) is a canvas panel. 


Step 4: Set the Anchors of the UI Switch. You can see 
thetwo canvas panels of the UL Switch located 
at the upper left comer of the 2D canvasin the 
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middle, and they look rather small. The parent 
of the canvas panel determines its size. Select 
the Ul_ Switch, and go to the Details panel. 

dick on the Anchors drop-down list, hold down 
Ctrl +Shift, and dick on the big square at the 
lower right comer to set it to f Il the entire canvas 
(Figure 17.23). 


Step 5: Add a tile view for the weapons. Go to the 


Lists section of the Palette panel, drag a Tile View 
to thePlaying canvas panel in the Hierarchy, 

and nameit WeaponsList. Go to the Anchors 
setting, hold down Ctrl and Shift, and dick on 
theicon that hasthe small square positioned 

at the bottom right comer (Figure 17.24). The 
WeaponsList is now at the bottom right comer. 


Anchors 


Anchors allow usto def ne how to place the UI element 
on the canvas. The white rectangle in these options shows 


how the UI 


For the UL_ 


is attached and f Iled into the whole canvas. 
Switch, we chose the last one, which f Ils the 
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entire space. For the tiled view, we want to position it at 
the bottom right corner; that's why we chose the one that 
has the square placed at the bottom right comer. 


Try to compile, and we got an error which says that the 
WeaponsList has no EntryWidgetClass (Figure 17.25). 


For the Tile View to work, we have to specify an entry 
or what kind of widget is used for the list to show. Let's 
create one right now. 


Step 6: Create another widget blueprint forthe entry. 
Create another widget blueprint and call it WBP_ 
Weapon. Open WBP Weapon, go to the top 
nght comer of the 2D canvas, and changethe 
Fill Screen to Desired. The Desired size makethe 
canvas thesizeof its content, and becausethere 
is no content yet, it becomes super small. Go 
ahead and add drag an ImageUl element from 
the Paletteto the Canvas Panel of the Hierarchy, 
and nameit Weaponlcon. Set its Anchorsto 
bein the center, and check on Size To Content 
(Figure 17.26). 

Step 7: Import UI Assets. Go to our support f les, 
andf nd the Ul folder. Drag the Ul folder to the 


= Timeline E Compiler Results 
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Content Browserto import them. This UI folder 
has some premade images for the weapons 
(rendered in Unreal Engine), a button with 

dif erent states, health bars, crosshairs, and 

a title. 

Step 8: Set up the Weaponlcon. With the 
Weaponlcon selected, go to the Details panel. 
Under the Appearance section, set theImageto 
Grenadel auncher. icon. And the Image Sizeto 
100 x100. Thissizeisarbitrary, and we can adjust 
it later. Doubleclick to open GrenadeLauncher 
icon, and in the Details Panel, set its Texture 
Group Under the Level Of Detail section to UI 
(Figure 17.27). 


Tips and Tricks 


Unreal processes dif erent textures based on their usage; 
for any Ul textures, you need to set their Texture Group to 
Ul. Make sure you change that for all other UI textures. 


Step 9: Add sometext to show weapon status and 
shortcut. Drag two Text fromthe Paletteto the 
Canvas Panel of theHierarchy. 
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For thef rst one, wewant it to show the 
ammo count, and nameit Status. Set the 
Anchors to the center, and check on the Size 
to Content option. In the Context, set the text 
to 10/10. Under Appearance, open the Font 
section and set the Szeto 8. Adjust the Y 
value of the Alignment to 3.5 to position it at 
thetop of theicon. 


Alignment 


The alignment setting def nes the distance the upper left 
corner of the Ul element isto the anchor proportionally. 
Thetext is anchored to the center. For the X and Y 
direction, a value of 0.5 meansthat the upper corner of 
the UI element is 5096 away from the center. We set the Y 
of the text to 3.5 to move it up 3.5 times (of its size). 


For the second text, name it Shortcut and anchor to the 
bottom-center. Check on Size to Content, set the Text to 1, 
and set the Size to 16. Figure 17.28 shows the settings for 
both text elements. 


Step 10: Make WBP_Weapon inherit 
UserObjectListEntry. To usethis WBP Weapon 
asan entry of the WeaponsList we added to 
WBP Master, we haveto makeit inherent an 
interface called UserObjectListEntry. Click the 
Graph button at thetop right corner to go to the 
graphsfor the widget. Click on the Class Settings 
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inthe Toolbar, go to the Interfaces section of 
the Details panel, and click the Add button. 
Search and select the UserObjectListEntry. A 

list of events got added to the Interfaces, which 
we will implement later (Figure 17.29). This 
UserObjectListEntry works the same way as our 
BPI HealthComp. 

Step 11: Use WBP Weapon asthe entryforthe 
WeaponsList. Go to WBP Master, and select 
Weaponslist in the Hierarchy. Go to the Details 
panel, and check on the Size To Content 
option. UndertheList View section, changethe 
Orientation to Horizontal. Finally, set the Entry 
Widg« Classunder the List Entries section to 
WBP Weapon, and set both Entry Height and 
Entry Width to 150. We should now beableto 
compileand savethe widget. After compiling, we 
can seea list of our WBP Weapon got added to 
thebottomleft comer (Figure 17.30). 

Step 12: Implement UlAddNewWeapon to 
WBP Master. Go to the Graph of WBP Master, 
and implement a new custom event called 
UlAddNewWeapon as shown in Figure 17.31. 

This UIAddNewWeapon takes a 
BP Weapon Baseasan input; we check if 
itis valid, and weadd itto the WeaponsList. 
TheAdd Itemis created by holding down 
Ctrl and drag the WeaponsList fromthe 
Variablesto thegraph and then drag out 
from WeaponsList; search for Add Item. When 
we call Add Item on WeaponsList, we ask it to 
create a new entry of the entry widget class 
weset up. It then associates the new entry 
with the Item we connect to the Item input 
pin. This Item, on theother hand, can be 
anything. 
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Step 13: Create and Add theUl to theviewport. Go 
toBP Hlen FPS, add a new variablecalled UI, 
and set itstypeto WBP Master object reference. 
Go to BP Hlen FPS PlayerController and add 
thesame variable. Go backto BP Hlen FPS, 
implement a new function called CreateUl, and 
call it at the end of Event BeginPlay (Figure 17.32). 

Westart with getting the controller and 
cast itto BP Hlen FPS PlayerController (the 
player controller we set in the game mode). 
Wethen created a widget of the class WBP _ 
Master and set the owner playerto BP_Hlen_ 
FPS PlayerController. Wethen usethenew 
Ul asthe values of the UI variables we added 
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to both the BP_Hlen_FPS_PlayerController 
and BP Hlen FPS. Thef rst SET is created 

by dragging out fromthe AS BP Hlen FPS 
PlayerController output pin of the Cast node 
and search for Set Ul. And f nally, we add it 
to the viewport. We call CreateUl at the end 
of Event BeginPlay, so we havetheUl added 
when we start the game. 

Givethegame another run, but 
surprisingly, we don't see anyUl. Thef ve 
entries we saw in WeaponsList is just for 
previews; to add an actual one, wehaveto 
call the UlAddNewWeapon we have created. 


Step 14: Call UlAddNewWeapon after 


AcquireNewWeapon. In BP_Hlen_ FPS, createan 
override of AcqurieNewWeapon, and implement 
it asshown in Figure 17.33. Play again, and we 
got a new entry added everytime we pick up a 
new weapon. 

Here, we call the parent function f rst to 
ensurethat we do all the things needed to 
bedonein the parent dass, wethen get our 
Weaponsarray, and get the last onein it (the 
new weapon). Then, we get the UI and call 
its UIAddNewWeapon event with our new 
weapon asthe New Weapon to Add input. 

So why areall the entries show the 
grenade launche? Wall, like what we have 
covered, when we add a new thing to 
WeaponsList in WBP Master, it creates an 
entry of thetype WBP Weapon for it. But 
noneof the processes provide what theicon, 
thestatus, and the short cut should bein 
thenew WBP Weapon. Wecan providethat 
in the interface we added to WBP Weapon 
earlier, but before we do that, let's add theUl 
information to BP Weapon Base. 


Step 15: Add Ul variables to BP Weapon Base 


and set them up in the weapons. Add three 


© UlAdd New Weapon 


} Event Acquire New Weapon Q Parent: Acquire New Weapon 
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Variables to BP Weapon Base. AUIWidget with 
thetypeof WBP Weapon object reference, a 
Weaponlcon, and a WeaponCrosshair, both of 
thetype Texture2D object references. Go ahead 
and setthemup in BP Gun, BP Pipe, and BP - 
GrenadeLuancher accordingly (Figure 17.34). 

Noticethat the WeaponCosshair for 
BP Pipeisempty, becauseit is does not have 
a crosshair. Forthe other two, even it looks 
like a white box, if you double click to open 
them, you can seetheir actual shape. 

Step 16: Create a GetWeaponUllnfo function. In 
BP Weapon Base createa new function called 
GetWeaponUllInfo and makeit a blueprint pure 
function. Implement itin BP Weapon Baseand 
overrideitin BP Ranged Weapon asshown in 
Figure 17.35. 

In BP Weapon Base, wearejust retuming 
all the UI variables we created in Step 15, the 
shortcut key, and a status. Onething worth 
noting is that we retumed the display name of 
the Shortcut key. Ifthe shortcut isthe 1 button on 
the keyboard, the Get Key Display Nameis 1, and 
thetype of it is Text. Also, we retumed an empty 
Status Output of thetype Text as well forthe 
Statustext widget we added to WBP Weapon. 

In BP Ranged Weapon, weoverrideit. Here, 
wehold down Ctrl and drag the AmmolInCip 
variableto thegraph, drag out fromit, search, 
and created a ToString nodeto convert it from 
an integer to a string. We do the samefor 
Amrolninventory so we can Append thesetwo 
with a '/"to createan ammo gauge that shows 





BP Weapon Base 





AGLRE 1735 Ingdevertaiand Git Vsparlrfa 


658 


theammo status. Wethen converted it to a text 
as the Status output. 


Step 17: Create an UpdateUl function in WBP 


Weapon. Open WBP Weaponsand click on the 
Designer button at thetop right comer to switch 
back to the Designer part of the widget. In the 
Hierarchy panel, select the Status text widget, 
goto the Details panel, and check on Is Variable. 
Do thesamething to the Shortcut text widget. 
Wehaveto check Is Variable on to access these 
two text widgets in the Graph. Go to the Graph 
of WBP Weapons, and create and implement a 
new custom event called Updateul (Figure 17.36). 

Because we have donethe information 
gathering and conversion in GetWeaponullnfo, 
what wedo hereis pretty lightweight. Wetakean 
input of BP Weapon Baseand set the Weapon 
Icon to usethe Weaponlcon of the weapon. 
Wethen set the Shortcut and Status fromthe 
GetWeaponull nfo. All three Set nodes are 
created by dragging fromthe three UI widgets 
and search. 

Creating these functions doesn't do us any 
good unless we call them. An interface call of 
On List Item Object Se f res on the creation of 
any new entry in Weaponslist. Let's implement 
it now. 


Step 18: Implement On List Item Object Set. Go to the 


Interfaces section under the My Blueprint panel. 
Right dick on the On List Item Object Set in the 
list and select Implement Function. Implement it 
asshownin Figure 17.37. 

Because you can add anything to 
WeaponsList as a new item, the List Item Object 
isof thetype Object (parent dass of Actor). This 
List Item Object isthe weapon we passed into 
the Add Item function in the ULAddNewWeapon 
event. Wef rst cast itto BP Weapon Base, and 


WeaponToUpdate J Set Brush from Texture J SetText (Text) 
EE ns S| 
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then weset the weapons UlWidget variableto 
this widget; by doing so, every weapon knows 
their associated WBP_ Weapon widget. We 
then pass the weapon to the UpdateUl event to 
update the UI widgets. 

Play the gameagain; when we pick up a new 
weapon, wenow get a Ul entry added with the 
correct information (Figure 17.38). 

Let’s review how everything istied up 
here. First, weadded a tile view widget called 
WeaponsList and specif y an entry of type 
WBP Weapon for it. Every time weacquirea 
new weapon, weadd the weapon as a new item 
to WeaponsList. When we add a new itemto 
WeaponsList, it creates a WBP Weapon, and f re 
theOn List Item Object Set event interface call 
to it. TheOn List Item Object Set takesthe new 
weapon astheinput parameter, and we useit 
along with thefunctions we created to modify 
thenew WBP Weapon. 

Remember the BP HealthComp and the BPI_ 
HealthComp? What is happening hereis similar 
to our health system. Coding using interface 
allows abstraction of the objects involved. The 
tile widget does not haveto know thetype of 
its entry and only requiresthe inheritance of 
theinterface. J ust like how our HealthComp 
knows nothing about its owner, all they haveto 
communicateto isthe interface. 

Step 19: Update ammo. Go to BP Ranged Weapon 
and look for the UpdateUl event we created 
before. Weareonly printing out the ammo 
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now. Let’s changeit to update our actual Ul 
(Figure 17.39). 

We just call the UpateUl on the UlWidget this 
weapon Is associated with. It was set up in the On 
List Item Object Set event. 

Play the gameagain and shoot out some 
ammo, you can seetheammo count on the 
weapons Ul updates nicely. 


Step 20: Set up crosshair. Go to WBP Master and 


drag an image widget to the Playing canvas 
panel. Anchor it to the center and check on its 
Size To Content. Under the Appearance section, 
open the brush subsection and set the Imageto 
Gun Crosshair. Set theVisibilityto Hidden under 
the Behavior section (Figure 17.40). 

Weset it to hidden because wedon' want to 
haveit on if wedon't havea ranged weapon. 


Step 21: Create UlWeaponSwtiched. Create 


and implement a new custom event called 

UlWeaponSwtiched to WBP_ Master (Figure 17.41). 
Wemakethe event to take a BP_ 

Weapon Baseobjec reference input called 

NewActiveWeapon. We supply the new active 


€» Event Update Ul O £? Is Valid 


| Iie Me Is Valid B "€ UpdateU E — Ur 
Input Object Is Not Valid D Ve is 


UlWidget Target 


Weapon to Update 





AGRE 1739 G'aretheuxiBd at 


_ > 
S Vai 


4 Slot (Canvas Panel Slot) 


Size To Conteh 5 


4 Appearance 


4 Brush J | Bind v. 


= Gun Grosshiow 
Image J 
4 uu 


4 Behavior 


Hold Shift to update the alignment to mat: 
Hold Ctrl to update the position to match. MEINEM Hidden v e | Bind v | 





AG 1740 Sd Acdaqcsarinapetotreetedtheu. 


661 





AGRE 1741 Inqdenertatiand Unta fitted 


weapon here when we call this event. In the 
event, we get the WeaponsList and call Set 
Selected Item with the new active weapon, 
which triggers an interface call on the entry 


(WBP Weapon) that wecan implement later. We 
then ge the WeaponCrosshair variablefromthe 
new active weapon and check if itis valid (pipe 
does not havea valid one). If it is valid, weset the 
Crosshair widget to useit asthetexture and set 
the widget to bevisible. If it is not valid, wesimply 


hidethe widget. 


Step 22: Call UlWeaponSwitched when we switch to 
a new weapon. Open BP Hlen FPSand override 
the WeaponSwitchHandsDownNotify. In here, 


wejust add a call to the UlWeaponSwitched 


event on the UI with our currently active weapon 


(Figure 17.42). 
Givethe gameanother go, and this 
time, when you pick up or switch to a ranged 
weapon, the crosshair appears; when you 
switch back to the pipe, it goes away. 


Step 23: Set up the selected and unselected ef ect. Go 
to WBP Weapon. Createtwo Vector2D variables: 
nameone of them DeselectediconSize and the 
other one SelectediconSize. Create two Slate Font 
Info variables name one of them DeselectedFont 
and theother one SelectedFont. Their values are 
shown in the bottom left comer of Figure 17.43. 


If you cannot seethe Roboto font in the Font 


Family drop-down list, click on theviewOptions 
at the bottomright of thelist, and check on Show 


Engine Content. 


© Event Weapon Switch Hands Down Notify C Qo Parent: Weapon Switch Hands Down Notify 
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After setting up the variables, implement the 
On Item Selection Changed interface as shown in 
Figure 17.43. 

Wehave mentioned in Step 21 that calling 
the Set Selected Item on WeaponsList triggersan 
interface call to the entry. This On Item Selection 
Changed event isthat interface call. Whenever 
an entryis selected or deselected, its On Item 
Selection Changed isf red. What we do hereis set 
theicon and font bigger when selected, and set 
them smaller when deselected. 

Playthegame again, and now you can 
clearly see which weapon is active (Figure 17.44). 

Let'smoveonto thehealth bar. 


Tutorial 17.4: Create the Health Bar 


Step 1: Createa health bar material. Create a new 
material called HealthBar Mtl. Open it, and 
in the Details panel, set the Material Domain 
to User Interface and the Blend Modeto 
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Translucent. Go to our UI folder, and drag the 
FPS Health bartothe Material Editor. If you do 
recall, the OcdlusonRoughnessMetallic textures 
we exported from Substance Painter havethree 
channels each representing a dif erent attribute 
of a material. ThisFPS Health baralso hasits 
channels represent dif erent things. The green 
channel istheoutline, and the red channel isthe 
alpha of the wholef gure. Thereis nothing in the 
blue channel. 

Step 2: Set up basic connections. Connect theR 
output to the Opacity input of the HealthBar Mtl 
node. Hold down L and dickto createa Lerp 
node, and connect the G channel to the Alpha of 
the Lerp node. Hold down V and click to create 
a color parameter; name it OutlineColor. Set the 
color of the OutlineColor parameter to white and 
connect itsf rst output pin to the B input of the 
Lerp node, connect the output pin of the Lerp 
node to the Final Color input pin of the material. 
You should now seethe outline appearsin the 
upper-left preview window. Create another color 
parameter and nameit LifeColor; makeit green. 

Createa LinearGradient node (right 
dick and search), and hold down M and 
dickto createa Multiply node. Connect the 
VGradient of the LinearGradient nodeto the 
Ainput of the Multiply node, and connect the 
f rst output pin of theLifeColor nodeto the B 
input of the Multiply node. Finally, connect 
theoutput of the Multiply nodeto theA input 
of theLerp node. You should now seea green 
gradient placein the outline (Figure 17.45). 

Step 3: Set up health bar control. Hold down S 
and dickto createa scalar parameter; name 
it HealthAmount. In the Details panel, set its 
Default Valueto 0.5 and Slider Maxto 1. Hold 
down O and dickto create a 1 —x node; this 
oneretumsthe result of 1 - input. Connect 
HealthAmount to the input of the 1 —x node. 
Create an If node by right dick and search. 
Connect the 1 —x nodeto theA input of 
thelf node. Connect the VGradient of the 
LinearGradient node we created in the previous 
step to theB input of the If node. 

Hold down 1 and dickto createa f oat 
number node, and in the Details panel, set 
its valueto 0.1 Connect it to the A>B input 
of the If node. Create another f oat number 
node, set itto 1, and connect it to the A<B 
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input of the If node. Finally, connect the 
output pin of the If to theA input pin of the 
Multiply node we created in Step 2. You 
should now seea half-f lled health bar. 
Changing the health amount fromOto 1 
changes the health bar from empty to full. 
Thelogic hereisto comparethe 

HealthAmount with the VGradient. 
TheVGradient is 1 at the bottom and O on the 
top. Weuself to makethe values bigger than 
HealthAmount becomes almost black (0.1), 
and the values smaller than HealthAmount 
becomes White (1). That then got multiplied 
to the green color (Figure 17.46). 

Step 4: Makethe color red if the health is low. 
Add another color parameter, name it 
LifeCriticalColor, and change its color to red. 
Create another If node. Connect the LifeColor 
totheA-Band A=B input of the new If node. 
Connect theLifeCriticalColorto the A «B input 
of the lf node. Select the HealthAmount we 
created in Step 3 and press Œr +W to duplicate 
it. Connect the duplicated HealthAmount to the 
Ainput of the new If node. Create another scalar 
parameter node, name it Critical Threshold, 
and set its default valueto 0.3. Connect the 
Critical Threshold nodeto the Binput of thenew 
If node. Finally, connect the new If nodeto the B 
input of the Multiply node (Figure 17.47). 
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Weuseda similar logic here. If HealthAmount 
issmallerthan Critical Threshold, changethe color 
to red. Apply, savethematerial, and dosethe 
Material Editor. 

Step 5: Createa material instance. Createa material 
instance of the HealthBar Mtl. 


Step 6: Create an enemy health bar material. 
Duplicatethe HealthBar Mtl and namethe 
duplication EnemyHealthBar Mtl. Open it, 
replacethe Texture Sample used to the Enemy 


Health bar, and changethe part wedid in Step 3 


to what is shown in Figure 17.48. 

Because the enemy health bar is 
honzontal, we usethe UGradient instead of 
the VGradient. Replacethe 1 —node with a 
reroute node. Switch the connections of the 
landOlfoatnumbersonthelf node. These 
changes are needed to makethe bar havethe 
correct increase or decrease direction. Save 
thematenal, and create a material instance 
fromit as well. 

Step 7: Createa WBP HealthBar Widget. Createa 
new widget named WBP HealthBar and open 
it. Set its sizeto Desired at thetop right comer. 
Giveit an Image widget anchored at the center 
and se the nameof theimage HealthBar. In 
the Details panel, check on theSizeto Content. 
Under the Appearance section, set the Image 
to HealthBar Mtl Inst and thelmagesizeto 
128 x256 (Figure 17.49). 

Step 8: Implement an UpdateHealthBar event. Go 
to the Graph of our WBP HealthBar, and create 
and implement a new custom event called 
UpdateHealthBar (Figure 17.50). 

This UpdateHealthBar event takes a f oat 
number input called Health Amount. We 
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get the Dynamic Material of the HealthBar 
image widget and se the HealthAmount 
parameter of the material to theinput. The 
Dynamic Material isthe material used by 
HealthBar (HealthBar Mtl Inst). It isdynamic 
becauseit is a copy of the HealthBar Mtl Inst 
dynamically created in the game when the UI 
is created. Whenever a material is dynamic, 
itis unique, and changing it does not af ect 
theoriginal one. Whenever this event f res, 
the HealthAmount parameter of the material 
is changed, which increases or decreases the 
health bar based on the input value. 

Step 9: Add WBP HealthBarto WBP Master. 
Open WBP Master, and in the Palette panel, 
open the User Created section and drag the 
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WBP HealthBar in thereto the Playing canvas 
panel of the Hierarchy. Set theanchorto bottom 
left, set the Position Xto 10, and Position Y to —10 
to of set it away fromthe comer 10 pixels. Check 
on Sizeto Content (Figure 17.51). 

Step 10: Create another UpdateHealthBar in 
WBP Master. Go to the Graph of WBP Master, 
create another UpdateHealthBar event that 
also takes a f oat input, and useit to call the 
UpdateHealthBar event of the WBP HealthBar 
(Figure 17.52). 


Why? 


So why do we create a new widget instead of just adding 
an imageto the WPB Master? Well, it depends on if you 
want to use it in other places too. We want to use it on 
the enemy as well, so an already built widget will come 
in handy. 
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Step 11: Update the health bar when the player takes 
damage. Open BP Hlen FPS, and overridethe 
HealthCompNotify UpdateUl interface as shown 
in Figure 17.53. 

What wedo hereis pretty simple when the 
health component asks usto updatethe Ul, we 
get theUl and call the UpdateHealthBar event. 
Wedon't want to start with half health; open 
HealthBar Mtl Inst, and set the HealthAmount 
thereto 1; do the sameto EnemyHealthBar Mtl - 
Inst. Play the game again, take some damage 
fromthe BP Dummy Al, and you can seethe 
health bar updates nicely. 

Step 12: Add health barto BP Dummy Al. Weare 
going to changeBP Dummy Al to our Patrolling 
Al, so it isan excellent timeto set up the health 
bar for it as wal. Open BP Dummy Al and add 
a Widget component to it. With the new widget 
component selected, go to the Details panel and 
set the Widget Class under the User Interface 
section to WBP HealthBar. Wedo not want to 
usethe human f gureasthe health bar, but let's 
pretend that it isthe enemy health bar, and use 
thetransformtoolsto put it abovethe head 
(Figure 17.54). 
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Step 13: Change the health bar appearance. Go 
to theevent graph. Add the code shown in 
Figure 17.55 to the Event BeginPlay node. 

What wedo here isto get the widget object 
fromthe Widget component f rst. Wethen cast it 
to WBP HealthBar. We get its HealthBar image 
widget and set its material to EnemyHealthBar - 
Mtl Inst. Playthegame again, and now you can 
seethe health bar appear nicely on the head of 
the character. However, when you look at the 
character fromtheside, you can seethat it isnot 
facing you (Figure 17.56). 

Step 14: Make the Health bar facethe player. Add the 
code shown in Figure 17.57 to the Event Tick. 

The Find Look at Rotation isa convenient 
function. It gives you the rotation needed for an 
object at the location of the start input to look at 
thelocation of the Target input. Wesupply the 
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world location of the widget as the Start input, 
and the player's eye viewpoint location asthe 
Target input. The Find Look at Rotation then 
retums the rotation needed for the widget to 
look at (face) the player. Wethen set that asthe 
rotation of the widget on every tick to makethe 
widget facethe player constantly. Givethegame 
another run, and the health bar is now always 
facing the player. Wealso removed the Attack 
function call. It was there just for testing. 

Step 15: Receive the notif es fromthe HealthComp. 
Implement the HealthCompNotify UpdateUl 
and the HealthCompNotify Dead as shown in 
Figure 17.58. 

When the HealthComp request UI update, 
we get the widget and call the UpdateHealthBar 
event; when the character is dead, we set it 
to invisible. Wewant this invisible behavior 
because we dont want it to be there whilethe 
death animation is playing. It will eventually get 
destroyed when the character is. 

Playthegameand shoot the enemyto test 
if the Ul updates; it should also disappear when 
you kill the enemy (Figure 17.59). 

Alrighty, onelast UI to go before we wrap 
this up: the pause and game over Ul. 


Tutorial 17.5: Create the 
Pause and Game Over UI 


Step 1: Add a button. Open WBP Master, and drag 
a Button fromthe Palette panel to the Pause 
canvas panel. Namethe button Restart, and 
anchor it to the center. Go the Details pane, and 
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set the Size Xand SizeY to 256 x256 in the slot 
section to def nethesizeof the button. 

Open the &yle subsection in the 
Appearance section. Set the Image of Normal 
to button. normal. Set the Image of Hovered 
to button hover. Set theImage of Pressed to 
button down and set the Image of Disabled to 
button disabled. For all four of them, set their 
Draw asto Image. 

Drag a Text fromthe Palette panel to the 
Restart button to attach a text to it. Changethe 
text to Restart (Figure 17.60). 

Step 2: Duplicatetwo more buttons. Select the 
Restart button and press ard +Wtwiceto create 
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two copies. Set the Position X and Position 

Y of thetwo new buttons back to 0. Set the 
Alignment Xof thef rst duplication to L8, and 
set the Alignment X of the second duplication to 
—0.8. Thethree buttons should now be aligned 
in a row. Changethetext of thef rst button to 
Resume, and thetext of the second button to 
Quit (Figure 17.61). 

Play the game, and we don't seethe 
buttons; this is becausethe Ul_ Switch widget 
Switcher Is by default switched to itsf rst child, 
which isthe Playing canvas panel. All the 
buttons are in the Pause canvas pandl. 

Step 3: Set up a switching enum. Createa new 
Blueprint Enumeration and call it EUISwitch. Give 
it three entries: Playing, Pause, and GameOver. 

Step 4: Create a UlSwitchTo event to switch UI. Go 
to the Designer of the WBP Master, select the 
Playing canvas pane, and check on Is Variablein 
the Details panel. Do the same thing to the Pause 
canvas panel. Create and implement a new event 
called UlSwitchTo in WBP Master (Figure 17.62). 

We check on thels Vanablesetting forthe 
Playing and Pause canvas panel to get access 
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to themin the Graph. Thefunction takes a 
EUlSwitch input parameter named Switch To. 
Drag out from Switch To and search for Switch 
on EUlSwitch to createthat yellow Switch on 
EUlSwitch node. For thethreeout execution pins 
of the Switch on BUISwitch node, only the one 
matchesthe value of the Switch To parameter 
isf red. For the Playing out execution pin, we 
simply ask the UlSwitch to switch to the Playing 
canvas panel. For the Pause, we set the Resume 
button to Enabled f rst and then switch to the 
Pause canvas pane. For the Game Over, we set 
the Resume button to not Enabled so that the 
player cannot resume when the game is over. We 
then switch to the Pausecanvas panel as well. 
Step 5: Add UlSwitch input. Add an Action Mapping 
to thelnputs in the Project Settings. Call it Menu, 
and assign the Escape and the Q button asthe 
keys. We add the Q button because when we play 
in theeditor, the Escape button is occupied by 
quitting the game. Implement the InputAction 
Menu in BP_Hlen_FPSasshown in Figure 17.63. 
All wedo hereisto get the UI and makeit 
Switch to Pause. Givethe game another run 
and hit the Q button, and wecan indeed seethe 
buttons pop up. However, we can't click on them, 
thereis no cursor, and wecan even keep playing 
thegame. 


Step 6: Set input mode and cursor visibility when 


switching UI, and add set pause. At the end of the 
Set Active Widget function calls of the UlSwitchTo 
function in WBP Master, add the extra code 
shown in Figure 17.64. 

After the Set Active Widget for the Playing 
canvas panel, we get the owning player and set 
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the mouse cursor not to show. And call Set Input 
Mode Game Only to evadeall Ul elements. We 
then called the Set Game Paused function and 
makeit not pause. Fortheswitching to the Pause 
canvaspanel, we show the mouse cursor, call Set 
Input Mode UI Only, makethis UI asthe focused 
Ul, and pausethe game. Another crucial thing 
wehaveto do hereis going to the Class Defaults, 
and check on the Is Focusable option. Focusing 
on aUl that isfocusableis needed to cancel all 
gameplay movements. We can play the game 
again, hit the Q button to switch on the UI, and 
seethe cursor pop up. The buttons arenot doing 
anything yet. 

Step 7: Createa GameOver and a Restart event in 
GM Hlen FPS.Open GM Hlen FPS. Goto its 
Event Graph and implement a Restart and a Quit 
event (Figure 17.65). 


© Restart 


Custom Event o J Get Current Level Name J Open Level J Set Input Mode Game Only 


P-—-» —X 8 P-b 
Return Value @ ———@&® ° ( e @ Level Name Player Controller 
SET 
v v ~ 


J Get Player Controller >» Show Mouse Cursor (7) 


Playerindex[0] ^ Return Value Target 


J Quit Game 
Ld 
Specific Player 
J Get Player Controller Quit Preference 


Player Index [0] ^ Return Value 


Ignore Platform Restrictions 
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For the Restart, we get the name of the 
current level, and open it by calling Open Level. 
Thenode between the Retum value of the Get 
Current Level Nameand the Level Nameinput 
pin of the Open Level node is automatically 
added when you connect thesetwo. Wethen get 
the player controller and set theinput mode back 
to gameonly and hidethe mouse cursor (this 
doesnot happen automatically). The Quit event 
just callsthe built-in Quit Gamefunction. 

Step 8: Implement the Button commands. Go back 
to WBP Master, and select the Quit button in 
the Variables. Go to the Details panel, and dick 
on the green button labeled with On Released in 
the Events section. An OnReleased (Quit) event 
got added to the Graph. This event f res when 
you dick and release the Quit button. We chose 
to usethe OnReleased becausethe On Clicked 
istoo abrupt. We get the game mode, cast it 
to GM Hlen FPS, and call its Quit event with 
OnReleased (Quit). For the Restart button, we do 
thesamething except wecall the Restart event of 
the game mode. For the Resume, wesimply call 
UlSwitchTo and se the Switch To input to Playing 
(Figure 17.66). 

Test the game again, and all buttons should 
work as expected. 

Step 9: Switch the UI to game over when the player is 
dead. Open BP Hlen FPS PlayerController, and 
f nd the Event On UnPossess. At the end of the 


—— — AAA 
© On Released (Quit) »» Cast To GM Ellen FPS Q Quit 


>—» > 
@ Object Cast Failed D » 
ff Get Game Mode / ASGMEllen FPS &»  — 
Return Value @ 


@ Target 


Restart 


E| Resume © On Released (Restart) >» Cast To GM Ellen FPS © Restart 


4 Events >-=—-D [4 ~— > 


o On Clicked @ Object Cast Failed > 

€» OnPressed DR "A Get Game Mode / AsGM Ellen FPS @  — 
©} On Released Return Value @ 

©} On Hovered —— E 

o On Unhovered UN mm 


@® Target 


© On Released (Resume) ©} UlSwitch To 
> larget is Wor Maste 
TE > 
> Target | self 


Switch To 


Playing ža 
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event, add a call to a Delay node with a 3-second 
duration. Then weget the UI and call UlSwitch 
To and set the Switch To input to GameOver 
(Figure 17.67). 

Playthegameagain, and shoot your feet 
with the grenade launcher to kill yourself. After 
3 seconds, the UI should pop up automatically 
with the resume button disabled. 

Step 10: Add a titleto the screen. When we pause 
the game, we want to seea paused text on the 
screen; when we switch to game over, we want to 
see a game over text on the screen. Add a Text to 
the Pause canvas panel and nameit MenurTitle. 
In the Details pana, check on Is Variable, and 
anchor it to the center. 

Set the Alignment Y to 2two to of set it up, 
check on Size To Content, set the Text to Paused, 
go to the Appearance section, and set Font Size 
to 100. 

Inthe UlSwitchTo event, insert two SetText 
nodes after the two Set Is Enabled nodes to set 
thetext of the MenuTitletext widget to Pause 
and Game Over (Figure 17.68). 





Possess | Q © UlSwitch To 


Li onc, LIE. 
Target self | Target 


In Pawn Switch To 
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= F Get Owning Player 

f Set Is Enabled J SetText (Text) get get 
= - - Target [self ] Return Value 

> LI 

Target Target 


© In Is Enabled v, - © In Text (Paused ] ~ 


Menu Title 


f Set Is Enabled J SetText (Text) J Set Active Widget 


È b * 


Target Zt Target Target 
Menu Title J UI Switch . 
© In Is Enabled (J © In Text [Game Over | ~ Widget 
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All right, that's about all the UI we want 
to cover in this book; however, feel freeto add 
things and experiment. J ust one more clean up 
to do: goto BP Character. Baseand deletethe 
Delay and Acquire New Weapon function call in 
Event BeginPlay. Theseare only for testing. We 
said we want the player to start empty-handed. 


Assignment 


Now you have done the in-game UI, remember the start 
menu we created on Chapter 13? It is now time to ref ne it! 
There is a Ul image called Title. Use it to your advantage. 
You also want to throw a few assets in the StartMenuLevel 
to spice it up (Figure 17.69)! 


Gather weapons 

Avoid and destroy security cameras 
Check the monitors 

Take down patrolling clones 

Don't get caught 


Destroy the "Cyber Eye” 
Freedom awaits! 


InGame menu:----ESC 


Es 
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Tips and Tricks 


If you want to know how the buttons and the title 

are made so you can create your own, take a look at 
Substance Designer. It is a sister software of Substance 
Painter. Substance Designer uses a node-based approach 
to create textures instead of using layers (Figure 17.70). 


Conclusion 


We havef nished the inventory, weapon pickup, weapon 
switch, health bar, and the main UI in this chapter. 

The player part of the game now feels fairly complete. 
Through the process, we keep following the rules 

of keeping the code clean and tidy. For the weapon 
inventory, we explored more waysto manipulate array 
and learned how to set up short cuts properly. For our 
Ul, we try to communicate with it through custom-built 
functions. 


Between the Weapon and the UI, we store icon, short 
cut, ammo count on the weapons, and we pass these 
data to the UI with well-built functions. It is essential to 
understand that there should be only one place to store 
these data. You don't want any information hardcoded 
to the UI, and it isonly a receiver to show the data from 
relevant game objects. 


There are still many aspects of the code that could be 
improved. But we are in a good spot to move on for 
building the enemies, and the real fun shall begin when 
we move on to that. 








In this chapter, we shall explore the perception system 
of Unreal Engine, along with other game mechanics. 

We are going to build asight perception and use that on 
a security camera. 


We are also going to explore how C++and Blueprint tie 
together with just a little C3-2- programming with visual 
studio. Don't get too scared because you will soon learn 
how scripting with Cis not that dif erent compared to 
Blueprint. 


With that being said, our focus is still Blueprint. We need 
to leverage just a little C++to get access to some handy 
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variables that Blueprint does not have access to. By giving 
you a little taste of C+; so you can also explore it yourself. 





Let's implement an Al perception actor in C++ 


Tutorial 18.1: Implement 
an AlSeer in C++ 


Step 1: Create a C++class derived from Actor. Right 
dick anywhere in the content browser and select 
New C++Cass. A new Add C++Class window 
pops up; select Actor in thelist and dick next. 

In thenext page, set the nameto AlSeer, press 
Create Class, and let it run for the rest to the 
setup (Figure 18.1). 

If you get errors, onething you want to do 
isto dose your project and update your Visual 
Studio to the latest version. If you get specif c 
errors, check for the error online. It is usually 


AL Add C++ Class 


Choose Parent Class 


This will add a C++ header and source code file to your game project. Ø Show All Classes 


Q Actor 
An Actor is an object that can be placed or spawned in the world. 


€, Actor Component 


An ActarCamnonent is a reiisahle comnonent that can he added ta anv actor 


Selected Class Actor 
Selected Class Source Actor.h 


Greate Class Cancel 


Name Your New Actor 


Enter a name for your new class. Class names may only contain alphanumeric characters, and may not contain a space. 
When you click the "Create" button below, a header (.h) file and a source (.cpp) file will be made using this name. 


NE Taal AlSeer| TheEscaper (Runtime) ~ FRU sion snr 


Path E:/GamePrjs/CreateGameWithUE4. chapter 18. start/Source/TheEscaper/ Choose Folde 


Header File E/GamePrjs/CreateGameWithUEA. chapter. 18. start/Source/TheEscaper/AlSeer.h 





Source File E/GamePrjs/CreateGameWithUEA. chapter. 18. start/Source/TheEscaper/AlSeer.cpp 


Back Greate Class Cancel 
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some missing components like not having the 
correct version of Microsoft.NET Framework. 
Please download and install any of these missing 
components. 

Next (if you are getting errors), go to your 
project folder, nght click on your unreal project 
f le and select Generate Visual Studio Files. A 
new visual studio solution f le with the same 
nameof your project got added after the 
generating process. Double dick to open the 
visual studio solution with Visual Studio. Go to 
the menu, and select Debug > Start Without 
Debugging. Visual Studio then startsto build 
the project, and open it after completion 
(Figure 18.2). 


Step 2: Open AlSeer in Visual Studio. Af lecalled 


AlSeer.h should now beopen in Visual Studio. If 
you don't see it, go to the Solution Explorer, open 
Games/TheEscaper/ Source/ TheEscaper/, and you 
should see AlSeer.h in there. Double dickto open 
it. You should also see another f le called AlSeer. 
cpp. Double click to open AlSeer.cpp as well. You 
can switch twof les by clicking on their tab above 
thetext editor. 


Tips and Tricks 


The Solution Explorer is like your content browser, and 

all the classes you created are here. The editor we are 
using in this book is using the dark theme. You can switch 
to the dark theme by going to Tools > Options to open 
the Options window. Find the General section under 
Environment and set the Color Theme to Dark. 


Step 3: Includethe Al Module. Open the TheEscaper. 


Build.cs located at the same location asthe 
AlSeer. Find thelinethat says: 
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Publ i cDependencyModul eNanes. 
AddRange( new stri ng[] { "Core", 
" CoreUObj ect", "Engine", "I nput Core" 


n; 


Insert a comma and then "AlModule" after "InputCore." 
So, it becomes (Figure 18.3): 


Publ i cDependencyModul eNanes. 
AddRange( new stri ng[] { "Core", 
"CoreUObj ect", "Engi ne", "I nput Core", 
"Al Modul e" }); 


Go back to your Unreal project and click on the 
Compile button in thetoolbar and wait for it to 

f nish. It should take a minute ortwo (adding 

a new moduletakestime). After completion, a 
notif cation should pop up and tells you Compile 
Complete. If you get errors, go backto Visual 
Studio and check if you have missed any comma, 
quotation marks, or have any miss spells. Keep 

in mind that case matters in C++ If you typean 
uppercase letter to a lowercase it is not going to 
work. This Al module is needed for usto usethe 
built-in Al perception system. 

Step 4: Include necessary f les into AlSeer.h. Open 
AlSeer.h, goto thetop of thef le, and insert the 
following threelines after thelinethat says 
#nclude "GameFramework/Actor.h:" 


# ncl ude "Percepti on/ Al Per cept i onConponent . h" 
# ncl ude "Percepti on/ Al SenseConf ig Si ght. h" 
# ncl ude "Conponent s/ Spot Li ght Component . h" 


What these three lines do isto include (copy and 
paste) these threef les to the AlSeer.h so AlSeer.h 
can use whatever is in thesethreef les. Weneed 
the AlPerceptionComponent, AlSenseConf g_ 
Sight, and the SpotLightComponent located 

in thesethreef les. After all the #ndludelines, 
you can seetheAlSeer class and many familiar 
faceslike Actor, BeginPlay, and Tick. The name 
of theAlSeer in C++is AAISeer, wherethe 


PublicDependencyModuleNames .AddRange 
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extra A indicates that it isa child class of Actor 
(remember how weadd an extra Ein front of the 
enumerations we created before?). 

Wedon't need to understand everything 
here, but Figure 18.4 shows a high-level view of 
the meaning of each line. 


Step 5: Add an AlPerceptionComponent variable. Go 


to thelinenght after the AAISeer(); and let's add 
thefollowing code: 


UPROPERTY( Edi t Anywhere, Bl uepri nt ReadOnl y, 
Category ="Al") 
UAI Per cepti onConponent * Percepti onConp; 


Thef rst line here dedaresthat what's next is 
an Unreal Enginevariable. This variable can be 
edited anywhere. Blueprint can read it, but not 
assign itto a dif erent thing, anditisalso intheAl 
category. Thesecond lineisthe actual variable, 
it is of the type UAIPerceptionComponent, 

and wenameit PerceptionComp. That * 

means that this variableis a pointer. We don't 
haveto understand what a pointer isfor our 
purposes. Thesemicolumn at the end of the 
second lineindicatesthat it isthe end of this 
statement. Adding thesetwo lines addsa 
variable called PerceptionComp that is of the 


"GameFramework/Actor.h" 


"Perception/AIPerceptionComponent.h" 
"Perception/AISenseConfig Sight.h" <4 Files we include to use their content in here 


“Components/SpotLightComponent.h" 
"AlSeer.generated.h" 


UCLASS ( ) s — sc — — — — M This is an Unreal Engine class 
THEESCAPER API 


{ Curly bracket to mark the begining of the class 
À ] [ ] ME Ui 5)).mm————— : n 
GENERATED BODY( , the engine so you don't have to see a hug 


———— This class is called AlSeer and it is the child class of Actor 


Unreal inserts all the nessary things here for the class to work with 


e amount of code 


em ~ ACCESS Specifiers (Remember we mentioned it before?) 


All lines start with // are comments, computer will ignore them 


AAISeer( ) P——— This is the construction script 


Jh ——————————— —ceess Specifiers (Remember we mentioned it before?) 


BeginPlay() _— The Event BeginPlay 


Things TORO T-80 zT: input parameters Access Specifiers (Remember we mentioned it before?) 


; €———— The Event Tick 


) ;Curly bracket to mark the end of the class 
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typeUAlPerceptionComponent. Thef rst lineis 
needed if we want to get accessto this variable 
in Blueprint. 

This UAIPerceptionComponent is needed 
for any actor who wantsto see, hear, or sense 
anything. Ideally, this should be added to an Al 
Controller asthe documentation recommends, 
but add it to an actor works as well. We need to 
give it conf gurationsto tell it what kind of sense 
we want to use. For our project, we want to give 
it a sight conf guration. 

Step 6: Add a UAISightConf g_ Sight variable. After 
thelines added in Step 5, add thefollowing code: 





UAI SenseConf i g Si ght* Si ght Conf i g; 


Thisonealso adds a variable, but it does 

not havethat UPROPERTY part; we don't 

need it because we don't want accessto it 

in Blueprint. This UAlSenseConf g_ Sight is 

a sight conf guration weneed to add to the 

PerceptionComp to enable seeing capability. 
Step 7: Add a USportLightComponent. Following the 

sametrend, let's add one more variable: 


UPROPERTY( Edi t Anywhere, 
Bl uepri nt ReadW'i t e) 
USpot Li ght Component * SeerLi ght; 


In this one, we added the UPROPERTY 
part because we wanted to access it in Blueprint. 
However, wedid not giveit a category— it is 
optional. Thevariable weadd hereis of thetype 
USportlightComponent, and wegiveit a name 
Seerl ight. As you can gradually see to add a 
component, you writethetypef rst followed by 
an *, add a spaceafter that, and then write down 
thenameof the variable. 
Now wehavecreated some vaniables for 

our AlSeer actor. Let's see how wecan create 
functions. 

Step 8: Add a SetSightRadius function. Add the 
following code after the code weadd in the 
previous step: 


UFUNCTI ON( Bl uepr i nt Cal | abl e, 
Category = "Al Percepti on") 
voi d Set Si ght Radi us( fl oat newRadi us) ; 


Return Value What the function takes as 
Void means Input, in this case, takes a float 
return Noting Name of the function named newRadius 


New Radiu 
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Forthef rst line, wededarethat what'snext is 
an Unreal Function. It can becalled by Blueprint, 
and its category is AlPerception. The second line 
istheactual function. Wecan break it down and 
compare it with a Blueprint function as shown in 
Figure 18.5. 
As you can see, thisis just a dif erent way 

of describing a function. We want to usethis 
function to set the radius of thesight, and we will 
cover how to implement it in just a bit. 

Step 9: Add a SetSightPeripheralVisonDegrees 
function. Let's add another function right below 
SetSightRadius: 


UFUNCTI ON( Bl uepr i nt Cal | abl e, 
Category = "Al Percepti on") 

voi d Set Si ght Peri pheral Vi si onDegre 
es(float Degree); 


Thisoneisalmost the same asthe previous 
one, except the name of thefunction and input 
IS dif erent. Wewant to usethis oneto set the 
peripheral vision of the sight. 

Alrighty, wehave created all the variables 
and functions we need for our new AlSeer class. 
Figure 18.6 shows everything we add to the code. 


The Header and the Source File 


There are two f les for every class in C+ the header f le 
and the source f le. The header f le has a “h” at the end 
and the source f le has a “cpp” at the end. So far, we have 
worked on the AlSeer.h, which is the header f le of AlSeer. 


AATSeer(); 
UPROPERTY(EditAnywhere, BlueprintReadOnly, Category = "AI") 
* PerceptionComp; 
* SightConfig; 
UPROPERTY(EditAnywhere, BlueprintReadWrite) 
* SeerLight; 
UFUNCTION(BlueprintCallable, Category "AlPerception") 
SetSightRadius( newRadius) ; 
UFUNCTION(BlueprintCallable, Category "AlPerception") 
SetSightPeripheralVisionDegrees( Degree); 
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Go to the Solution Explorer and open AlSeer.cpp and you 
can also see some familiar faces in here: the BeginPlay and 
the Tick event. 


The header f le shows the variables and functions a class 
has. The header f le is like a list, but not showing any detail. 


The source f le shows the detailed implementation of the 
functions. As you can see in AlSeer.cpp, there are curly 
brackets after every function which encapsulates the 
implementation of these functions. Figure 18.7 shows 
how this could be compared to a Blueprint class. 


You can think of the header f le as the Components and 
the My Blueprint panel, where you add new components, 
variables, and functions. You can think of the source 

f le as the Event Graph, where you write code with the 
components, variables, and functions. In the sourcef le, 
the body of the function is inside the two curly brackets. 
As shown in Figure 18.7, the body of the BeginPlay 
function is inside the two curly brackets underneath it. 


Header File = Componets & MyBlueprint Source File = Event Graph 


+AddComponent- [EE 
AAISeer(); TEE 
UPROPERTY(EditAnywhere, BlueprintRea iea 
* PerceptionCo 
* SightConfig; 
UPROPERTY(EditAnywhere, BlueprintReac ™ 
* SeerLight; Weise 


: :BeginPlay( © Event BeginPlay O | © Parent: BeginPlay 


UFUNCTION(BlueprintCallable, Categor 
SetSightRadius( St 
UFUNCTION(BlueprintCallable, Categor 

SetSightPeripheralVisionDegrees 


(QtventTik. O 
> 
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Let’s write our code in AlSeer.cpp. 


Step 10: Construct the components. Thef rst 
function in AlSeer.cpp isthe construction script 
equivalent, and it is called the constructor of the 
dass. Its namehas an AAlSeer:: added in front of 
it, andthis meansthat thisfunction belongsto 
AAlSeer. In the body of the constructor, add the 
following code: 


Seer Li ght = Creat eDef aul t Subobj ect «US 
pot Li ght Component X "Seer Li ght"); 
Percepti onConp = Creat eDef aul t Subobj e 
ct «UAI Per cepti onConponent ~ "Per cepti o 
nConp" ) ; 

Si ght Conf i g = Creat eDef aul t Subobj ect < 
UAI SenseConf i g Si ght X "si ght Conf i g"); 
Root Component = Seer Li ght; 


Thesethreelines areafter the PimaryActorTick. 
bCanEverTick =true; thef rst line creates an 
actual spotlight component and assigns it 

to SeerLight. This CreateDefaultSubobject 

isa function that creates a component. The 
USportLightComponent in the angle brackets 
indicates thetype of the component, and the 
SeerLight in the quotation marksisthe arbitrary 
name we supply. The next two lines createthe 
PerceptionComp and SightConf g thesame way. 


Why? 


In the headerf le, we only created the variables but not 
assigning anything to them, so they were still empty. After 
these three lines, actual components are created and 
assigned (using "—") to the variables. 


Step 11: Set up the root component. Add the 
following line after the lines added in the 
previous step: 


Root Component = Seer Li ght; 
This line set the root component of the actor to 


SeerLight, which means that this light is now the 
root of all other components. 
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Step 12: Set upthe SightConf g variable. Keep adding 
thefollowing line: 





if (Si ghtConfi g && Percepti onConp) 
{ 

Percepti onConp - > 

Conf i gur eSense( *Si ght Conf i g) ; 

} 


Here, wef rst did something called an if 
statement. If statement checks ifthe things 
inthe parentheses aretrue. Thecodein the 

curly brackets only runs when thethingsin the 
parentheses aretrue. What we are checking in 
the parentheses is if both the SghtConf g and 
PerceptionComp areall valid. Thetwo “&’ strings 
combined arethe syntaxfor and. 

If Both components are valid, which 
they should, we moveonto thelinein the 
curly bracket. Here, wecall a function of 
PerceptionComp named Conf gureSense. The 
space in front of the line is added by hitting 
the Tab button. In C+, calling a function of an 
object is written as object ->function(inputs. ..). 
The->is called the access operator (consists of 
a "anda “>’), and weuseitto get something 
froman object. If we want to get a variablefrom 
an object instead of a function, wewriteit down 
as object variable. 

This Conf gureSensetakes a UAlSenseConf g 
as theinput, and it conf guresthe 
PerceptionComp to usethe UAlSenseConf g as 
a sense. The SghtConf g we passed in here is of 
thetypeUAlSenseConf g Sight, which isa child 
class of UAISenseConf g. We pass it in to givethe 
PerceptionComp a sight conf guration. 

Log story short, wehave now given the 
PerceptionComp (as well asthe AlSeer), the 
ability to see stuf . Figure 18.8 shows how the 
AAlISeer::AAlSeer() function looks like eventually. 

Step 13: Set uptheattributes of the SightConf g 
in BeginPlay. Now you have got the hang of 
how to implement new things in CH; and add 
thefollowing codeto the AAlSeer::BeginPlay() 
function: 


if (SeerLi ght & Si ght Config && 
Per cept i onConp) 
{ 


PrimaryActorTick.bCan 

SeerLight = CreateDef 
PerceptionComp = ( 

SightConfig = CreateDefau- 
RootComponent = SeerLight; 

if (SightConfig && PerceptionComp) 


PerceptionComp- >ConfigureSense(*SightConfig) ; 
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Si ght Conf i g - > Si ght Radi us = 
Seer Li ght -> Att enuati onRadi us; 

Si ght Conf i g - > LoseSi ght Radi us = 
Seer Li ght -> Att enuati onRadi us; 

Si ght Config -> 
Peri pheral Vi si onAngl eDegrees = 
Seer Li ght - > Out er ConeAngl e; 

Percepti onConp -> 
Conf i gur eSense( *Si ght Conf i 9) ; 
} 


Here, weareusing theif statement again, 
and wecheck if Seerl ight, SghConf g, and 
PerceptionComp areall valid. If they are, then we 
moveon to the code inside the curly bracket. The 
f rstthreelinesin the curly bracket are setting up 
the variables of SightConf g. 

We makethe SightRadius the same as 
the AttenuationRadius of the SeerLight. We 
then make the LoseSightRadius the same. 
The SightRadius variable def nes how far the 
sight can reach, and the LoseSightRadius is 
now far the sight lose track of something after 
seeing it. In reality, LoseSightRadius should 
be slightly bigger than SightRadius, but we 
madethemthe sameto simplify it. The third 
line makes the PeripheralVisionAngleDegrees 
variable of the SighConf g to the 
OuterConeAngle variable of the SeerLight. 
This PenpheralVisionAngleDegrees variable 
def nes the peripheral vision of the sight. These 
three lines set the SghtConf g to bethe same 
as the reach of the SeerLight. This way, we can 
visualize the sight by looking at the light. 
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: :BeginPlay() 


::BeginPlay(); 
if (SeerLight && SightConfig && PerceptionComp) 


SightConfig->SightRadius = SeerLight->AttenuationRadius ; 
SightConfig->LoseSightRadius = SeerLight->AttenuationRadius; 
SightConfig->PeripheralVisionAngleDegrees = SeerLight->OuterConeAngle; 
PerceptionComp-»ConfigureSense(*SightConfig); 
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Thelast linereconf gures the PercepitonComp 
so that the changes we've made are applied. 
All the attributes of the senseare reconf gured 
when the game tarts. Figure 18.9 shows how 
the BeginPlay function looks like after adding 
our code. 

Step 14: Implement SetSightRadius and 
SetSightPeripheralVisonDegrees. We havetwo 
functions we have created in the headerf le let's 
implement them. At the end of AlSeer.cpp, add 
thefollowing code: 


voi d AAI Seer: : Set Si ght Radi us( f | oat 
newRadi us) 
{ 
if (Si ghtConfig & 

Percepti onConp && Seer Li ght) 
{ 

Seer Li ght - > Set Att enuati onRad 
| us( newRadi us) ; 

Si ght Config - > Si ght Radi us = 
newRadi us; 

Si ght Config - > LoseSi ght Radi us 
= newRadi us; 

Percepti onConp - > 
Conf i gur eSense( *Si ght Conf i g) ; 

} 

} 


voi d AAI Seer: : Set Si ght Peri pheral Vi si o 
nDegr ees(fl oat Degree) 


{ 
if (Si ghtConfig && Percepti onConp 


&& Seer Li ght) 
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{ 


Seer Li ght -> 
Set Out er ConeAngl e( Degr ee) ; 
Seer Li ght -> 


Set | nner ConeAngl e( Degr ee) ; 
Si ght Config -> 
Peri pheral Vi si onAngl eDegrees = 
Degr ee; 
Per cepti onConp - > 
Conf i gur eSense( *Si ght Conf i 9) ; 
} 
} 


Weimplement both functions in here. First of 

all, the AAlSeer:: added in front of their nameis 
needed to indicate that they belong to AAlSeer. 
For thef rst one, wedid our validation check f rst. 
Wethen moveon to set up the attenuation radius 
of SeerLight to newRadius by calling itsfunction 
SetAttenuationRadius. This newRadius isthe 
input parameter. When we call thisfunction in 
Blueprint, we can specify this variable. The next 
two lines set the SghtRadius and LoseSightRadius 
variablesto newRadius as well. And then we 
reconf gureour PerceptionComp. 

Thesecond function is almost the same, 
and the dif erencehereisthat weare setting the 
peripheral vision. 

Go backto our unreal project and hit the 
Compile button again. It should compile pretty 
fast thistime. 

It is very likely to get a compilefailed 
notif cation if thisisthef rst time you do C++ 
coding. Go back and carefully check every line 
and make sure you follow the code written in this 
book to theletter. Therecould bea miss-spelling, 
missing a parenthesis, or only have one "& for 
theif statements. Don't get frustrated if you 
cannot f nd theissueright away, giveit time, and 
you will beableto compile successfully. 

If, however, you still can't makeit work, in 
thesupportf le, we have put both the AlSeer.h 
and AlSeer.cpp in there. You can open them with 
Visual Studio, copy, and pastethe code from 
thesetwof lesto yours. Onething to avoid when 
copying isthe THEESCAPER APl on line 13, this 
oneis dif erent if your project is named dif erent; 
keep this onethe way you havein yourf le 
(Figure 18.10). 
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Now wehavedone with CH; let's keep on 
building our AlSeer in Blueprint. 


Tutorial 18.2: Create the Blueprint 
Version of AlSeer by Inheriting 
fromthe C++ Version 


Step 1: Createa BP. AlSeer class and set up the light. 
Add a folder called Seer in the Blueprints folder. 
Createa new blueprint dass derived from AlSeer 
and nameit BP AlSeer (you haveto open the All 
Classes section in the Pick Parent Class window 
and search for AlSeer to useit asthe parent 
dass). Open BP AlSeer, and you can seethat 
the SeerLight and PerceptionComp arein the 
Components already; they arethe components 
wecreated in CH- Select the SeerLight, go to the 
Details pane, and set the Light Color to a green 
color. We want it to look green when it does not 
seethe player and tum red when it does. Set both 
the Inner Cone Angle and the Outer Cone Angle 
to 30, soitisa narrower light than before. 

Step 2: Set the detection rules. Select the 
PerceptionComp in the Components panel, And 
goto the Details panel. Under theAl Perception 
section,open Sense Conf g and you can seethat 
thef rst onein thereis Al Sight Conf g. Expand 
this Al Sight conf g and the Sense section in it 
to accessits settings. Expand the Detection by 
Af liation section, and check on Detect Neutrals 
and Detect Friendlies. Thereisno way to def ne 
who is Enemy, Neutrals, or Friendlies without 
CH, so we check everything on here. 


Why? 


You can also see the Sight Radius, Lose Sight Radius 
in here, so why do we want to set them in CH? Well, 





the problem is not that we cannot change these in the 
Details panel, we can. However, you cannot change these 
attributes outside of the details panel. Try to set these 
variables in the Event Graph is impossible. We need to 

be able to change them with the Event Graph if we want 
to customize it for dif erent purposes. Besides, with our 
setup, whatever we do to the light got automatically set to 
these values here when the game starts. 


Step 3: Createa custom event to set the color of 
thelight. Create and implement a new custom 
event called ChangeLightColor as shown in 
Figure 18.11. 

This event takes a boolean input called 
Sensed; we se the color of SeerLight to a red 
color if the input istrue and set it back to green if 
the input is false. We want to call this event when 
weseeand losesight of the player. 

Step 4: Implement the On Target Perception 
Updated event. Select PerceptionComp, go 
to the Events section in the Detail panel, and 
dick on the plus button labeled with On Target 
Perception Updated. A new event appearsin the 
Event Graph. This On Target Perception Updated 
event f res whenever the PerceptionComp senses 
or un-senses something, the Actor input isthe 
actor sensed or un-sensed. The Stimulus input 
has detailed information about the sense. Drag 
out fromit and select Break AlStimulus to create 
a Break AlStimulus node, expand it, and you can 
seea wholelot of information there. Implement 
therest of thefunction as shown in Figure 18.12. 


J Set Light Color 


n - > rA d 
Seer Light 


New Light Color 


———— 
X. Branch SRGB J 


© ChangeLightColor 


[3 & True > 


Sensed Condition False > 


Seer Light Target 


Inputs 
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Target 


f Set Light Color 


New Light Color 
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€» On Target Perception Updated (PerceptionComp) C >» Cast To BP. Ellen FPS 
bp — — LA > 
Actor Object Cast Failed [> D D 


© Change Light Color 


Stimulus As BP Ellen FPS Target [self] 


7 z E _| © Sensed 
= Break AlStimulus e 


AlStimulus Age © 
Expiration Age O 
Strength © 
Stimulus Location © 
Receiver Location C» 
Tag © 
Successfully Sensed ^ —' 


A 
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What wedo hereisto cast the Actor 
toBP Hlen FPS;thisautornaticallyf Iters 
everything else. We then usethe Succesully 
Sensed variable of the stimulus as the input to 
call CQnangeLightColor. 

Placea BP AlSeerto theleve, walk into the 
light, and you should seeit tum red, walk out, 
and it tums back to green (Figure 18.13). 

Step 5: Make the light cast volumetric fog. 
Go to the World Outliner and type 
ExponentialHeightFog in the search bar to f nd 
the ExponentialHaightFog we positioned when 
we were building the level. Select it, go to the 
Details pane, and check on Volumetric Fog in 
the Volumetric Fog section. Open BP AlSeer, and 
select the Seer ight in the Components panal. 
Goto the Details panel and set the Volumetric 
Scattering Intensity to 500. You should now 
see beautiful volumetric fog cast fromthe light 
(Figure 18.14). 
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iz World Outliner -. Components 


ExponentialHeightFog +Add Component z 
Label a > BP_AlSeer(self) 
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> 
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PPS (Inherited) 
2) Details 

Fem ExponentialHeightFog 3) Details 

Search Details ; 


4 Volumetric Fog í Light 


Nolometiic Fog E Volumetric Scattering Intensity 2 





Step 6: Build a scan line ef ect. Go to StaticMeshes/ 
Shared/ and lookfortheSreen Base Mtl we 
have built for our screens. Drag it to the Seer 
folder and select Copy Hereto make a copy. Go 
to theSeer folder and renamethe copied one 
Seer Light Mtl. Open Seer Light Mtl; with the 
Seer Light Mtl nodeselected, go to the Details 
panel and changethe Material Domain to Light 
Function. Removethe ScreenTexture node and 
theMultiply nodeit connects. Connect the Linear 
Sineoutput pin of the LinearSine nodeto theA 
input of the Multiply nodethat connectsto the 
Emissive color. Finally, usethe UGradient asthe A 
input of the Add nodeinstead of the VGradient. 
Savethe material and create a material instance 
fromit (Figure 18.15). 

Step 7: Apply Seer. Light Mtl Instto BP. AlSeer. 
OpenBP AlSeer and select SeerLight. Go to the 
Details panel, and under the Light Function 
section, set the Light Function Material to Seer _ 
Light Mtl Inst. Thescan lines may appear too 
big and movetoo fast. Open Seer light Mtl Inst 
and changethe ScanLineSizeto 0.01 and the 
ScanLineSpeed to 0.02 (Figure 18.16). 


í LinearGradient C$Seerlight Ml 7—7 
UV Channel /2) UGradient @ -~ 
VGradient O NE v “LinearSine 
A € — VETE) Linear Sine @ 


Period (S) Rounded Linear Sine © 
-1 to 1 (B) Direction O» Muttiply = 
Sine Phase (B) R 


€ — @ Emissive Color 


Param (0.03 


ScanLineSpeed w - B 
Param (0.1) ScanLinSze œ 

Er i —À— T 
Param 





o 
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ScanLineSize 
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Step 8: Create an interfacefor BP_AlSeer. Createa 
new blueprint interface and nameit BPI AlSeer. 
Open BPI_ Seer, and renamethenew function 
OnSeerTargetUpdate. Givethefunction an 
input parameter called Stimulus and set its 
typeto Al&imulus. Givethe function another 
input parameter called Target and set itstypeto 
BP Hlen FPSobjec reference. 

Step 9: Usetheinterfacefunction to inform 
the owner and its Al Controller. Open 
BP AlSeerand implement a function called 
InformOnwerAndOwnerA (Figure 18.17). 

Thisfunction takesthe sameinput asthe 
OnSeerTargetUpdateinterfacefunction we 
created in Step 9. What we do hereis calling that 
OnSeerTargetUpdateinterfacefunction on both 
the owner and theAl Controller of the owner 
with its inputs. 

Step 10: Call InformOnwerAndOwnerAl in the On 
Target Perception Updated event. Go back 


SA Seer Target Update kad 
Target is BPI AlSeer 


J Get Owner b 2 
| Target is Acto PE Target 
© Target [self] Return Value E hi Stimulus 


ES Target 


S On Seer Target Update taal 
Target is BP! AlSeer 


} InformOnwerAndOwnerAl A í | £ f Get AlController 


f BE Controlled Actor Return Value @ ~ b D 
EB pe IE Target 
Stimulus on Stimulus 


Target (». ——— : @ Target 
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© On Target Perception Updated (PerceptionComp) 
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to theOn Target Perception Updated event 
we created earlier, and add a call to our new 
InformOnwerAndOwneAl function after Cast To 
BP Hlen FPS. Don't forget to connect the AS BP 
Alen FPSof the Cast function to the Target and 
the Stimulus output of the event to the Stimulus 
input of InformOnwerAndOwnerA (Figure 18.19). 
Wehavenow created a BP. AlSeerthat talks 
to its owner and its Al Controller whenever it sees 
or loses sight of something. Let's create a security 
camera and makeit capturethe player when the 
player walksinto its sight with thehelp of our 
BP AlSeer. 


Tutorial 18.3: Create a 
Security Camera 


Step 1: Create a security camera class. Create a new 
folder called SecurityCamera in Blueprints and 
add a new blueprint dass derived from Actor. 
Namethe new class BP. SecurityCamera and 
open it. Go to StaticMeshes/security camand 
drag all the meshes inside if it to the Components 
ofBP SecurityCamera. 

Step 2: Add rotation pivots and arrangethe meshes. 
Add a scene component to BP. SecurityCamera. 
Thescenecomponent is a component that has 
atransform, but not a visual representation, 
and wecan useit asa rotation pivot. Nameit 
CameraPitchPivot and moveit down —44 units 
on the Zaxis s it is at the pivot the body of the 
camera should rotate around when it pitches 
up and down. Select all the meshes except the 
security cam security cam yaw handle geo 
andthesecurity cam security cam base. 
geo, and drag themto CameraPitchPivot to 
parent them under CameraPitchPivot. Finally, 
parent CameraPitchPivot to security cam - 
security cam yaw handle geo. Rotate 
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€ BP SecurityCamera(self) 


A, DefaultSceneRoot 
£y security cam security cam base gep 
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CameraPitchPivot down 60 degrees on the 
X-axis, and you can see that it's ableto makethe 
camera pitch down (Figure 18.19). 

Step 3: Add a Light. Select CameraPitchPivot, go to 
Add Component, add a Spot Light component, 
and nameit SeerRef. Rotate it 90 degrees on the 
Z-axis, so its X-axis (forward axis) isfacing the 
direction of the camera. Drag it along theX-axis 
to position it at the lens of the camera. Set the 
color of thelight to thesameastheBP AlSeer 
and change its Volumetric Scattering Intensity 
to 500. Drag a copy of BP_SecuntyCamera to the 
ceiling and check if we got the light positioned 
correctly (Figure 18.20). 

Step 4: Spawn BP. AlSeer and attach it to SeerRef. 
Add a new variable called Seer to BP « 
SecurityCamera. Go to Event Graph, and add the 
code shown in Figure 18.21 to its Event BeginPlay. 

Wehavedone very similar things in the 
weapon chapter. Here, we spawn a BP. AlSeer at 
thetransformof our SeerRef, store it to the Seer 
variable we created, and attach it to SeerRef. 
This way, when the gamestarts, a BP. AlSeer got 
created and attached to the camera. 

Step 5: Set up BP. AlSeerto match SeerRef. Add the 
code highlighted in Figure 18.22 to the end of 
Event Begin Play. 

After the AttachActorToComponent, we 
also wantto match thesight of BP AlSeerto 
the reach of the SeerRef spotlight. We called 
the CH function SetSightRadius on Seer to 
Set its sight radiusto the attenuation radius 
of Seer Ref. Wethen call the CH function 
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SetSightPeripheralVisionDegreesto set its 
peripheral vision angleto theouter cone angle of 
SeerRef. Eventually, we hide SeerRef. This way, we 
can just edit SeerRef in the editor, and when the 
gamestarts, theBP AlSeer becomesthe same. 

Step 6: Createa timelineforthecamera 
rolling. Create a new custom event called 
StartRollingCamera. Drag out fromits 
execution pin and add a timeline. We 
had used timeline before when we were 
creating thesliding doors; namethetimeline 
CameraRollingAnimationLerp. Double click to 
open it. Add a new f oat track and nameit Lerp 
and makethe length of thetrack 3 seconds. 
Add two keyframesto thetrack, select thef rst 
one, and set itstimeand valueto O. Set thetime 
of the second key to 3 and the valueto 1. This 
animation is changing from Oto 1 in 3 seconds 
(Figure 18.23). 

Step 7: Updatetherotation of the security cam - 
security cam yaw handle geo with the 
timeline. Drag security cam security cam - 
yaw handle geofromthe Components 
panel to the graph to createa referencefor it. 
Drag out fromthenew reference and create 
a SetRelativeRotation for it. Right dick on the 
NewRotation input pin and select Split Struct 
Pin, the NewRotation input now becomes three 
inputs for the X, Y, and Z of the new rotation. 
Call the SetRelativeRotation with the Update 
out execution pin of thetimeline. Add two new 
f oat variables to BP SecurityCamera: nameone 
of them CameraLeftReach and set its valueto 
45 and namethe other one CameraRightReach 
and set its valueto —45. Make both new 
variables public. Create a Lerp node (the one 
named just Lerp), drag CameraLeftReach from 
the Variablesto theA input of the Lerp node, 
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and drag CameraRightReach to the B input 
of the Lep node. Connect the Lerp output pin 
of thetimelineto the Alpha input of the Lerp 
node. Connect the Retum Value of the Lerp 
nodeto the New Rotation Z (Yaw) input pin 
of the SetRelativeRotation node. Finally, call 
this SartRollingCamera at the end of Event 
BeginPlay (Figure 18.24). 

What wedo hereis just linear interpolates 
twof oat values with thetimelineto updatethe 
rotation of the camera. Play the game, and you 
can seethat the camera rotates from its left to its 
right, but it only doesit once. Let'sf xit by using a 
Delay and a Hip Flop node. 

Step 8: Makethe Camera roll back and forth. Create 
a Delay node with a duration value of 1.5 
seconds and movethenode abovethetimeline. 
Createa Flip Flop nodeand call the Flip Flop with 
the Completed out execution pin of the Delay 
node. Connect the Finished out execution pin of 
thetimelineto thein execution pin of theDelay 
node. Connect theA out execution pin of the Flip 
Flop nodeto the Reversefrom End in execution 
pin of thetimeline. Connect the B out execution 
pin of Flip Flop nodeto the Play in execution pin 
of thetimeline (Figure 18.25). 

When the Flip Flop iscalled, it f res Af rst; 
then the next time when it's called, itf res B; after 
that, itf resA again, so it'sf ip-f opping theout 
execution pins every time it gets called. 

What happens hereis when the animation 
isf nished, the Delay node got called. After 
a L5-second delay, the Flip Flop gets called, 
and the execution goesthrough theA output 
execution pin f rst. TheA execution pin then calls 
the Reverse from End in execution pin of the 
timeline, which causesthetimelineto play again 
backward. The camera then rolls back because 
of that. When theanimation f nishesagain, it 
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reaches to the Delay and the Flip Flop one more 

time. This time, the B execution pin f res and calls 

the Play in execution pin of thetimeline. From 

here, the execution repeats itself. 
Playthegameagain, and you can see 

thecamera now rolls back and forth nicely. 

You can adjust the angle in whatever amount 

you wish for every camera you placein the 

level by adjusting the CameraRightReach and 

CameraLeftReach in the Details panel. 

Step 9: Add a stop functionality. Go to the 
StartRollingCamera event, insert a Gate node 
between the Delay nodeand the Flip Flop node, 
and check of the Start Closed option. Createa 
custom event called StopRolling and connect 
itto a Sequence node. Connect Then 0 of the 
Sequence nodeto the Closein execution pin of 
theGatenode. Connect Then 1 of the Sequence 
nodeto the Stop in execution pin of thetimeline 
(Figure 18.26). 

The Gate node behaveslikea gate. When 
Closeis called, it closes and stopsall execution 
fromgoing through. When this StopRolling event 
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iscalled, it dosesthe Gate node and stopsthe 
timeline, which stopsthe camera from rolling. 

Step 10: Makethe camera stop when it seesthe 
player. Go to the Cass Settings and add the 
BP| AlSeerto its interfaces. In the Blueprint panel, 
expand the Interfaces section. Right dick the 
On Seer Target Update and select Implement 
function. An Event On Seer Target Update got 
added to the graph, add a call StopRolling with it. 

Givethegame another go; the moment 
you walk in the camera’ssight, it stops rolling, 
and the light tums red. Let's makethe player 
surrender to the camera when the camera sees 
them. 

Step 11: Create surrender animation montages. Go 
to Blueprints/Characters/ Hlen/Animations and 
f nd Elen FPS Grenade Launcher Caught, 
Hlen FPS Gun Caught, and Blen FPS 
Pipe Caught. Create animation montages for 
each oneof them and make sureto check of 
the Enable Auto Blend Out option for these 
montages. 

Step 12: Add surrender animation montagesto the 
weapons. Open BP Weapon Base, and add a 
new variable called SurrenderAM. Set thetype of 
the vanable Anim Montage object reference. Go 
to BP Gun, BP Pipe, and BP GrenadeLauncher, 
and assign their respective caught animation 
montages. 

Step 13: Create a surrender functionality to BP - 
Hlen FPS.Open BP Hlen FPS, createa new 
function called SurrenderTo, and implement it as 
shown in Figure 18.27. 
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This event takes an actor input called 
Capturer. We add Do Once so this can only 
happen once. Wethen f nd the look at rotation 
needed for the eye viewpoint (PlayerEye) to 
look at the Capturer input. And then, we set the 
controller's rotation to the rotation found. 


Why? 


Notice here that we did not usethe PlayerEye to f nd the 
look at rotation; instead, we used the Get Actor Eyes View 
Point. This is because there is a possibility that the actual 
player is not looking through the PlayerEye camera. For 
the same reason, we set the rotation of the controller 

(the actual player) instead of PlayerEye. This part of the 
function makes the player look at whatever the Capturer's 
input is. 


Step 14: Finish SurrenderTo. After the Set Control 
Rotation of the SurrenderTo event, add extra 
codeto stop the movement of the character, 
playthe surrender animation montage, and 
show the game over Ul. Don't forget to call it at 
the end of the Event On Seer Target Update in 
BP SecurityCamera (Figure 18.29). 

Here, weset theinput modeto UI only 
to block all player inputs. Wethen play the 
Surrender montage, delay for 1.5 seconds, 
and then switch the UI to game over. We call 
SurrenderTo at the end of Event On Seer Target 
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Update of BP_SecurityCamera and use self 
(the camera) asthe Capturer. 
Play the gameagain and walk into the 
sight of the camera. The view automatically 
rotatesto thecamera, followed by the surrender 
animation, and thegame over UI. We also want 
to beableto kill thecamera with just one shot, so 
let's moveon to the camera shut down sequence. 
Step 15: Store the pitch rotation in Event 
BeginPlay. Add a new f oat variable called 
ActivePitchRotation to BP SecurityCamera. Hold 
down Alt and drag ActivePitchRotation from 
the Variables panel to the graph to create a set 
nodefor it. Call this new Set nodeat the end of 
Event BeginPlay. Drag CameraPitchPivot from 
the Components panel to thegraph to createa 
referencefor it. Drag out from CameraPitchPivot, 
search, and create a GetRelativeRotation node. 
Right dick on the Relative Rotation output pin 
and select Split Struct Pin. The output now breaks 
into X, Y, and Z channels. Connect the Relative 
Rotation X (Roll) to the Active Pitch Rotation 
input pin of the Set node (Figure 18.29). 


f Set Visibility íf © Start Rolling Camera 


a b» — b | E 
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Why? 


You may ask why do we use X instead of Y; after all, Y isthe 
pitch of a rotation. Well, which axis is for the actual pitch is 
not f xed, and it is often dif erent under dif erent parents. 
Go to the viewport and rotate the camera up and down. 
You can see that it is the X-axis of CameraPitchPivot that is 
changing. 





Step 16: Createa PlayCameraDeathAnimation 
event. Create a new event called 
PlayCameraDeathAnimation and call it in Event 
AnyDamage (Figure 18.30). 

Here, we call Stop Rolling f rst to stop 
the rolling of the camera. Wethen create 
another timeline, which isthesame asthe 
CameraRollingAnimationLep timeline we 
did earlier except that its length is 2 seconds. 
Weusethistimelineto interpolatethe 
rotation of CameraPitchPivot linearly from 
ActivePitchRotation to 90 (vertical). The Event 
AnyDamageis created by right dicking and 
searching. 

Playthegameand shoot the camera; then it 
should stop rolling and rotates down. However, 
it still captures you when you walk into its sight. 
Let'sadd a disablefeatureto BP AlSeer. 

Step 17: Createa Disablefunctionto BP AlSeer. 
Open BP. AlSeer and implement a function 
called Disableas shown in Figure 18.31. 

Thisfunction takes a Boolean input 
named Do Animation. We want to useit on the 
patrolling Al later on, and wedo not want to 
play an animation if it's on the patrolling Al, 
so weadded a boolean to control it. Westart by 
dragging out the PerceptionComp and call its Set 
Sense Enabled function to disablethe sense; make 
surethat you se the Sense Classto AlSense Sight. 
IftheDo Animation istrue, wef rea timelineto 


4 g © Play Camera Death Animation __ 
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J Set Sense Enabled 
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animatethe intensity of the SeerLight. If the Do 
Animation isfalse, wejust set the intensity to 0. 
Thetimeline wedid hereis a bit more 

interesting. We started by adding a f oat track 
called intensity with a length of 1. Wethen add 
two keysto it: thef rst key isat the beginning and 
hasa valueof 5000, and thesecond key is at the 
end with a value of 0, and you can hit F to frame 
the whole graph. After that, we randomly add a 
few more keysto thetimeline and drag then up 
and down dramatically to mimica light blinking 
ef ect (Figure 18.32). 

Step 18: Call Disable at the end of Event 
AnyDamage. Go back to BP. Security Camera, 
f nd Event AnyDamage, hold down Alt, and drag 
Seer to the graph. Drag out from Seer and call its 
Disable event with Do Animation checked on at 
the end of Event AnyDamage (Figure 18.33). 
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Step 19: Spawn VFX. At the end of Event Damage, 
add the code shown in Figure 18.34 to spawn an 
NS Sparkleat thelocation of CameraPitchPivot. 

Alright, we havef nished the security 

camera. Thanksto our BP. AlSeer, most of thejob 
istheanimation and game over event. Weare 
going to leverage BP_AlSeer in other parts of the 
game as well. Let's create a monitor class that 
shows what the camera sees. 


Tutorial 18.4: Create a 
BP Monitor Class that Shows 
What the Camera Sees 


Step 1: Add a Scene Capture Component 2D. Open 
BP SecurityCamera. With SeerRef selected in the 
Components panel, dick on Add Component 
and search for Scene Capture Component 2D. 
This Scene Capture Component 2D can capture 
the scene and render out a texture. It should 
now be parented under SeerRef, so it sees what 
BP AlSeer sees. Renamethis new Scene Capture 
Component 2D to Capturer. Go to the Event 
Graph and f nd Event BeginPlay. Drag Capturer 
fromthe Components panel to the graph to 
create a reference nodefor it. Drag out fromthe 
node and add a call to its Set Component Tick 
Enabled function at theend of Event BeginPlay. 
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Makesurethat the Enabled is checked of 
(Figure 18.35). 

Rendering a scenefrom a Scene Capture 2D 
isn't cheap it’s likerendering thesceneone more 
timel Set Component Tick Enabled can disable 
theirtick, which preventsthemfrom constantly 
rendering anything. This way, wecan save much 
performance. We will makethemtick only when 
the player gets dose. 

Step 2: Createa captureinfo structure. In the 
SecurityCamera folder, right dick in theempty 
spaceand select Blueprints Structure. Name 
thenew structure FCapturelnfo. Doubleclick to 
open it and you can seethat by default, it holds a 
Boolean variable. Changethat Boolean variable 
to Integer and set the nameto targetH ement. 
dick the New Variable button to add a new 
variable nameit SecurityCamera, and set its 
typeto BP SecurityCamera object reference 
(Figure 18.36). 
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Structure 


Structure is the predecessor of class. It is designed 

to bundle multiple variables and functions together, 
invented back in the C language. Blueprint ripped of its 
function feature, making it a pure data collection. We use 
structure when we want to bundle multiple variables. 

In our case, we want to use it to def ne what material 
element to assign the captured texture and which camera 
to capture from. The F added in front of its name is again a 
naming convention Unreal adapts. Actors start with an A, 
structures start with an F, and enums start with an E. 


Step 3: Create a monitor class. Create a blueprint 
dasscalled BP Monitor derived from 
BP Triggerable Open BP Monitor, select 
the Trigger, and scale it up four times or so 
to makeit easierto betriggered. Add a new 
static mesh component to it and set the 
static mesh to monitors Monitor 02 (we can 
Switch to anyoneelse when using it). Give 
ita new variableof thetype Name, nameit 
ScreenTextureParamaterName, and set its 
default valueto ScreenTexture. ScreenTextureis 
the name of the ScreenTexture parameter we set 
in Screen Base Mtl in Chapter 4. Add another 
variable called Capturelnfos, set its variabletype 
to FCaptureinfo, and make it an array. Make 
both vanables public (Figure 18.37). 

Step 4: Create dynamic material instances for the 
mesh. Go to the Event Graph of BP_Monitor. Add 
the code shown in Figure 18.38 at the end of the 
Event BeginPlay. 

What wedo hereisto loop through the 
Capture Infos (which we will populate later in 
the editor). We breakthe structure so wecan 
accessits Target Hement variable and createa 
dynamic material for the monitor mesh from 


VETE G 


Variable Name Capturelnfos 
mum 


Variable Type 


Variable Type 


4 Default Value 
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that element. Dragged out from Array Bement 
and select Break FCapturelnfo to createthe Break 
FCapturelnfo node. TheCreate Dynamic Material 
Instance creates a copy of the material of the 
supplied Hement Index. It then assigns it to the 
mesh supplied to the Target input. Becausethis 
isa copy of the material, changing it does not 
af ect the onginal one. This way, what wedo to 
this material only af ectsthe supplied model. 
Step 5: Create render targets and assign themto the 
dynamic materials. Keep on going fromthe end 
of the code done previously, and add the code 
highlighted in Figure 18.39. 

Inthishalf, wecreatea render target 2D, 
which isa dynamictexture we can assign to our 
screen. We se its width and height to 128 x128 
and set theformat to RTF RGBA SRGB. This 
format isa littlemoreef cient than thedefault 
settings. We get the BP. SecurityCamera from 
theFCapturelnfo and get the Capturer we added 
in Step 1. Wethen drag out fromit and createa 
Set Texture Target node. Wethen usethe Render 
Targe 2D created asthe Texture Target. The 
Capturer now captures what it seesto this render 
target 2D. Finally, weassign this render target 
2D to the Scenelexture Parameter of the newly 
created dynamic material in the previous step. 


J Create Render Target 2D 


width [128] 
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Step 6: Make capturers tick when overlayed and stop 
them fromticking when unoverlapped. Because 
ourBP MonitorisfromBP Triggerable, we can 
overridethe Overlapped and UnOverlapped 
eventsto makethe capturerstick when the 
player overlaps with thetrigger and stop their 
ticking when the player leaves. Figure 18.40 
showsthe implementation of the Overlapped 
and Un Overlapped event. 

Step 7: Test our BP Monitor. Open the static mesh 
of the monitor and you can seethat the monitor 
model hasthree monitors, each assigned with a 
Screen Base Mtl Inst. These screen materials 
areon elements 1, 2, and 3. Drag a BP. Monitorto 
the scene, go to the Details panel, and add three 
elements to the Capturelnfos array by clicking 
the “+’ sign. Set thethree TargetHements to 1, 2, 
and 3, so they match with the material elements 
of the monitor. 

Placethree BP SecurityCamerasto thelevd. 
Put one of themin the next hallway, the other 
onein thestorage room, and the last oneto 
the boss room. Go backto the BP Monitor and 
set thethree BP SecurityCamerasto thethree 
SecurityCamera entries of the Capture Infos 
variable. 

Playthegamenow, get doseto the 
monitor, and you can seethe three captured 
scenes in thethree monitors. You can also see 
them stop playing when you move far away 
(Figure 18.41). 


3 Array elements 
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Conclusion 


In this chapter, we elaborated some time with C++ 

to create an Al_ Seer class which later on polished in 
Blueprint. We leverage its seeing capability to create 
our security camera with mostly animation setups. We 
practiced the component and interface programming 
paradigm again and will benef t from this programming 
pattem when we move on to the patrolling Al. 


For the monitor, we have covered how to create structures 
to bundle data together. Structures could also be used for 
our weapon UI if you wish to do some refactoring. 


It is exciting to have some enemies to play with f nally, but 
it would be more fun if they can move. Let's move on to 
the next chapter and create our patrolling Al. 
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Patrolling Al 





Hello, and congratulations on coming this far. In this 
chapter, we are going to explore the Al system of Unreal 
Engine and build a patrolling Al that can make the game 
fun to play. As we start to make more gameplay elements, 
one thing to always keep in mind isthe balance of the 
game. 


We want the player to feel fun, progression, and 
challenged. But it does not come free as we build 

more and more stuf . It takes many playtests to know if 
something works or not, and sometimes good ideas pop 
up, but not really f t into the whole structure. 
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The game developer should always keep in mind that 
you are creating an experience you want the players to 
have. It doesn't have to be based on anything realistic. 
On the contrary, most of the time, you realize that it's not 
fun when it’s too real. Instead, we want to be the director, 
and we direct how the player should feel when they play 
the game. 


We will build our Al system based on that approach. 


It's important to know what you want, so let's talk about 
what Al we are going to build. We want an AI that: 


1. Patrols when it does not see the player. 

2. When seeing the player or hit by the payer, move to 
the player and shoot the player every 2 seconds. 

3. Ifitlost sight of the player, keep pursuing in 10 more 
seconds; if it still cannot see the player, go back to 
patrolling. 

4. When touched by the player, or getting 400 units close 
to the player when pursuing, capture the player. 

5. When dead, spawn a weapon pickup. 


Here, we have made some assumptions; f rst of all, we 
assume that the Al can always reach you. However, you 
could be standing on a boxthat the Al cannot reach. 

But we can get away with much programming with this 
assumption. In this case, Al just goes back to patrolling. 
Second, Al just knows where you were when it got hit. 
Again, not true in real life, but we can get away with much 
programming with that assumption, and the game is still 
fun. Let's go ahead and start building our Al. 


Tutorial 1: Create the 
Patrol Al Character 


Step 1: Create BP. Patrol. Select the BP. Dummy Al 
and renameit BP Patrol. Create a new folder 
called PatrollingAl under the Characters 
folder and moveBP Patrol to thefolder. 

Step 2: Add SeerRef. J ust like how we added a 
spotlight to the security, we can do the same 
here. Select the Mesh component and add a Spot 


Light component. Renamethe spotlight SeerRef. 
Under the Sockets section in the Details panel, 
click the magnifying glass of the Parent Socket 
and select head. SeerRef is now attached to the 
head joint. Go to the Viewport, and you can see 
that it’s looking up. Rotate and moverit, so it's 

in front of the eye, and theX-axisis pointing 
forward; thef rst half of Figure 19.1 showsthe 
process. 


Step 3: Spawn BP. AlSeer and attach it to 


SeerRef. We have donethis on the security 
camera already, and we do exactly the 
samething here. At the end of Event 
BeginPlay, we spawn a BP AlSeer, set it to 

a new variable called Seer, and attach it to 
SeerRef. Wethen call SetSightRadius and 
SetSightPeri pheralVisionDegrees on Seer to 
set the sight radius of Seer to the attenuation 
radius of SeerRef, and Seer's peripheral vision 
angleto the outer cone angle of the SeerRef. 
Don't forget to hide SeerRef. The volumetric 
fog istoo annoying on BP. Patrol. Let's set the 
Volumetric Scattering Intensity to 0. The second 
half of Figure 19.1 showsthe calling of the Set 
Volumetric Scattering Intensity function. 


Step 4: Create a gun for BP. Patrol. Createa new gun 


called BP Gun Patrol derived from BP Gun. In 
the event graph, overridethe Auto Reload if Clip 
is Empty as shown in Figure 19.2. 


€» Event Auto Reload if Clip Is Empty "t Q Parent: Auto Reload if Clip Is Empty -- 


a : 
Ammo in Inventory 


Add pin + 


Ammo in Inventory 
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What wedo here is after rdoading, givethis 
gun more ammo, so it never runs out of ammo. 
That’s nght! Wearegiving theAl inf nite ammo. 

Step 5: Give BP_ Patrol thegun. Open BP. Patrol, 
call AcquireNewWeapon at the end of Event 
BeginPlay, and set the Weapon Class to BP _ 
Gun Patrol. Placea BP Patrol inthelevel, play 
the game, and we shall see it holding the gun 
(Figure 19.3). 

Step 6: Expose the WeaponClass variable of 
BP Weapon Pickup. To spawn a weapon pick 
up when theAl dies, we need to beableto 
specify the weapon class for the BP Weapon _ 
Pickup. Open BP_Weapon_Pickup, select the 
WeaponClass variable, and check on Expose 
on Spawn in the Detail pane. Wealso want 
the player to bethe only one who can pick up 
weapons. Changethe Cast To BP_Character_ 
Baseat the beginning of Event Overlapped to 
Cast To BP Hlen FPS(Figure 194). 
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Steo 7: Make Al Soawn a weapon when dead. 


Open BP_ Patrol, add a new vanable Loot, set 

its variabletypeto BP Weapon Basedass 
reference, and makeit public. At the end of Event 
BeginPlay, call a function named Bind Event On 
Destroyed. Drag out fromthe Event input pin 

of the Bind Event On Destroyed node and select 
Add Event ^ Add Custom Event. Namethe new 
event SpawnLoot. Implement SoawnLoot as 
shown in Figure 19.5. 

TheBind Event On Destroyed bindsthe 
event connected to the Event input to the 
destruction of this actor. So, when BP Patrol is 
about to get destroyed, SoawnLoot is called f rst. 
In SpawnLoot, we spawn a BP Weapon Pick. 
Noticethat thereis a Weapon Classinput. It is in 
there because we checked on Expose On Spawn 
onthat variablein BP Weapon Pickup. What 
happens now is when a BP. Patrol is dead, a 
BP Weapon Pickupis created; the purple Loot 
variableis a new variable we added, it is of the 
type BP Weapon _Base dass reference. Weuseit 
as the Weapon Classto spawn the pick up. 

Clean up all the weapon pickups you have 
inthelevel, placea BP Weapon _Pickup in the 
start room, and set its Weapon Classto BP Pipe 
in the Details panel. Drag a BP. Patrol inthe 
next room, make it facing away from the door, 
and set the Loot to BP Gun in the Details panel. 
Playthegame, pick up the Pipe, and go knock 


“BH Bind Event to On Destroyed 


> D 


Target [ self] 


M 
| © SpawnLoot " 


Custom E 


Destroyed Actor 


Loot 


| ————— 2 Tue> — D 
ils Vald Class © Condition False (5 


Class Return Value ^ 


J GetActorTransform 


Collision Handling Override 


Weapon Class 


Instigator 


Target [self] ^ Return Value & 


AG 195 MdeA Spannawesamwheancesd 


I| 7^ uu m SCC T 
Branch @ SpawnActor BP Weapon Picku 
| pa po p 


@ Spawn Transform 


Return Value 





D 


721 


Credting GrreswithUred Engine Suostene Parte; &lVaya 





down the BP_ Patrol. ABP Weapon Pickup of 
the gun should appear and you can pick it up 
(Figure 19.6). 

Step 8: Create a CapturePlayer and a StopAl function 
that maketheAl capturethe player and stop its 
Al logic (Figure 19.7). 

The StopAl function gets the controller of 
BP Patrol and cast it to an Al Controller. We 
then get its Brain Component and stop its logic. 
We have yet to create the Al controller and the 
brain of the Al. However, we can already def ne 
a function that stopsthem. All this falls into the 
Unreal Engine Al framework, and weare going to 
cover more later. 

For the CapturePlayer function, we get the Al 
Controller and called its SetFocus function. The 
New Focus input isthe player, which makes the Al 
look at the player. Wethen call our StopAl event 
and make the player surrender to this BP. Patrol. 
The Surrender To function was built earlier when 
wewere creating the security camera. 

Step 9: Call the Capture player when touched. 

Select the CapsuleComponent, go to the details 
panel, and dick on the plus button labeled 
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with On Component Hit in the Events section. 
Implement the newly created On Component Hit 
(CapsuleComponent) as shown in Figure 19.8. 
What we do here is check if the other actor 

that hits the capsule component is the player 
by casting and then calls CapturePlayer if it is 
theplayer. Playthe game again, and approach 
totheBP Patrol. Theinstancethat you touch 
it, it captures you right away. Theengine will 
complain about the brain component that does 
not exist. Weare going to add it later. 

Step 10: Disablethe collision, destroy Seer, and 
stop theAl when BP. Patrol isdead. Wehave 
already overridden the HealthCompNotify Dead 
and hidethehealth bar there. Let's add the 
code highlighted in Figure 19.9 at the end of it 
to disablethe collision of Capsule Component, 
Destroy Seer, and stop the Al logic. 

Step 11: Add variablesto store patrol points. Add 
a new public variable called PatrolPointsto 
BP Patrol, set its vanabletypeto Target Point 
object reference, and changeit to an array. Add 
another variable of the type integer and nameit 
CurrentPatrolPointlndex. The Target Point class 
islikea locator that you can placeitto thelevel. 
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You will see how it looks like when we start to 
placeit. 

Step 12: Implement a function to get the next 
patrol point. Createa new function called 
GetNextPatrolPoint, give it two outputs: the 
f rstoneisnamed PatrolPoint and is of thetype 
TargetPoint, and the second oneis a Boolean 
called Found. Implement thef rst half of the 
function as shown in Figure 19.10. 

In this half of thefunction, we checkthe 
length of PatrolPoints and seeif it is bigger than 
0, or in other words, has patrol points. We retum 
an empty patrol point and falseif it has no 
patrol point. 

Step 13: Implement the second half of 
GetNextPatrolPoint (Figure 19.11). 

This part is very similarto our GetNextWeapon 
function. After the True output pin of the Branch 
node, we increment CurrentPatrolPointindexto 
get the next index. To makeit cycles back, we 
haveto do a modulo operation with thelength of 
PatrolPoints. Wethen set CurrentPatrolPointindex 
tothenext index, get thenext target point in 
PatrolPoints, and retum it with a truevalueforthe 
Found output. Thedif erencehereisthat we used 
theindexto storewhich oneisthecurrent one. 
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Now, wehavean array wecan populate 
and cydethrough; let's moveon to build the Al 
system and makethe Al patrol. 


Tutorial 2: Create Al Controller and 
Behavior Tree for the Patrol Al 


Step 1: Create an Al Controller. Create a new 
blueprint dass derived from Al Controller (you 
haveto search for it in All Classes). Namethe 
new Al Controller AIC Patrol. Open BP Patrol 
and go to its class defaults. Under the Pawn 
section, set the Auto Possess Al to Placein World 
or Spawned and set the AI Controller Gass to our 
new AIC. Patrol. This setup makes BP. Patrol to 
be possessed by an AIC Patrol when placed or 
spawned in the world (Figure 19.12). 

Step 2: Createa blackboard and a behavior tree 
Right dick in the PatrollingAl folder, select 
Artif cial Intelligence Blackboard, and name 
the NewBlackBoardData to BB Patrol. Right dick 
again and select Artif cial Intelligence Behavior 
Tree, and namethe NewBehaviorTree BT. Patrol. 


Blackboard and Behavior Tree 


People make decisions based on what they know, and 
Al is no dif erent. The blackboard is the knowledge of 
the Al, and the behavior tree isthe brain of the Al. The 
behavior tree decides what the AI should do based on the 
information populated on the blackboard. The blackboard 


4 Pawn 
Use Controller Rotation 
Use Controller Rotation 
Use Controller Rotation 
Can Affect Navigation ¢ 


Auto Possess Player 


Auto Possess Al Placed in World or Spawnedv > 


Al Controller Class e O X 
AGURE 1912 thP Pard tobepossesssdbyan/AC. Parra. 





725 


n Creating Genes wthUr'red Engine Sudoskancee Parts; &Maa 


726 





can have information like does the Al see the player? 
What isthe next patrol point? And the behavior tree can 
then decide if the Al should go to the next patrol point 
or pursue the player based on if the AI can see the player 
or not. 


Step 3: MakeAIC. Patrol useBT Patrol. Open AIC. 
Patrol and add the code shown in Figure 19.13to 
Event BeginPlay. 

This Run Behavior Treefunction makes 
theAl usetheBT Patrol asits brain (the brain 
component we saw earlier). BT Patrol nowtells 
theAIC Patrol what to do. BecauseAIC_ Patrol 
possesses BP. Patrol, BP Patrol now follows the 
instructionsfromBT Patrol. 

Step 4: Add a NextPatrolPoint blackboard key. Open 
BB Patrol, dick on the New Key button, and 
select Object to create a new key of thetype 
Object. Blackboard keys arethe knowledgethe 
Al knows, and it can bean object, a location, 

a Boolean, or anything. Namethe ObjectKey 
NextPatrolPoint. Go to the Blackboard Details 
panel on theright, and expand the Key Type 
option under the Key section. Set the Base dass 
to Actor. This NextPatrolPoint is now of thetype 
Actor and wecan populateitto bethe next 
patrol point we want theAl to go (Figure 19.14). 

Step 5: Create a basic behavior tree. Open BT. Patrol 
and f nd the ROOT node in the graph. Drag out 
fromthe darker gray bar at the bottom of the 
node, search for Sequence, and select Sequence 
in thesearch list to create a Sequence node. 
Drag out fromthe left sde of the gray bar at the 
bottomof the sequence node, search, and create 
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a MoveTo node. With the Move To node selected, 
goto the Details panel and set the Acceptable 
Radiusto 100. Drag out fromtheright sideof the 
gray bar at the bottom of the sequence node, 
and search and create a Wait node. The steps 
and the results are shown in Figure 19.15. 

Let’s break it down here. The ROOT nodeis 
the starting point of the behavior tree, and all the 
logic starts from here. Step 1 added a sequence 
node, which means when the Al starts, we want 
theAl to do a sequence of tasks. 
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Step 2 added a Move To node under 
thesequence node. This MoveTo nodeisa 
behaviortreetask that the engine provides, 
and it makes the Al moveto something. Notice 
that at the bottom of the Move To node it says 
Movelo: NextPatrolPoint, and this is because 
NextPatrolPoint isthe only key in the blackboard, 
So it’s automatically selected as thetarget for 
the Move To task. We can changeit to other 
blackboard keys in the Details panel. Adding a 
Move To node under the Sequence node means 
that thef rst task in the Sequence is Move To 
something. Setting the Acceptable Radius to 100 
means that theAl just has to move closer than 
100 unitsto thetarget. 

Step 3 added a Wait node. Wait node is 
another built-in task that makes the Al Wait for a 
certain amount of time. It is currently waiting for 
5 seconds. You can changethe amount of timeto 
wait in the Details panel as well. 

Theimageat the bottom right comer of 
Figure 19.15 isthef nished tree. The sequence 
node runs from left to right. In a behavior tree, 
thingsontheleft alwayshavehigher priority 
thantheright and are executed f rst. So, the 
wholeAl logic here is when the behavior tree 
starts, do a sequence of tasks. Thef rst task isto 
Moveto the NextPatrolPoint, and the next task 
isto wait for 5 seconds. After waiting, there is 
nothing left in thetree repeat fromthe ROOT 
node again. You can drag to movethetasks 
around to rearrangethe order. 

Playthegameagain with BT Patrol open, 
and you can seethe behavior tree starts to run, 
and the node highlighted with yellow isthe 
current task being executed. Hit F8 to un-possess 
and moveto the next room with regular 
navigation of the editor. 

You can seethat theAl isnot moving, which 
makes sense because we haven't given any patrol 
pointto it yet. Don't stop the game, and hit the 
Pause button in the behavior tree window to 
pausethe game. Wecan then hit the Back: Over 
button to go back through time and see what 
theAl isdoing previously. Clickthe Back Over 
button a few times, and then start clicking the 
Forward: Over to see how theAl progresses. You 
can see, every time it starts from Root, then to the 
Sequence and runs Move To, and then falls back 
to Root again. The Wait task is never executed. 


Behavior treetasks can fail, and what is 
happing hereisthat the Move To task fails. It fails 
because the NextPatrolPoint is None as shown 
in thegreen box in Figure 19.16. Whenever a task 
in a sequencefails, the whole Sequencefails and 
aborts. 

TheAl wearecurrently viewing is in the 
blue box of Figure 19.16, and itisan AIC Patrol. 
You can view a dif erent Al by selecting onein 
that dropdown list. Wecan pausethe game 
anytime and usethe behavior tree window to 
debug theAl. 


Step 6: Create a new behavior treetask. Stop the 


game and click on the New Task button in the 
toolbar of the behavior tree window to create 
a new behavior treetask. It automatically 
opens, and you can seea new asset called 
BT Taks BlueprintBase New got added to 
the Content Browser. Renamethis new task 
FindNextPatrolPoint. 


Step 7: Implement FindNextPatrolPoint. Open 


FindNextPatrolPoint (it should already be open 
if you did no doseit in the previous step). Give it 
a new public variable called NextPatrolPointKey, 
and se its variabletypeto Blackboard Key 
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Selector. Overridea function called Receive 
Execute Al and implement it as shown in 
Figure 1917. 

This Event Receive Execute Al is called when 
thetask starts. The Controlled Pawn input is 
the pawn of theAl Controller, and the Owner 
Controller isthe Al Controller. We cast the pawn 
to BP Patrol and call its Get Next Patrol Point 
function to ge the next patrol point from it. 

Wethen call a function called Set Blackboard 
Value as Object, and this one setsthe value of 
a blackboard key that is of the type Object. We 
pass the patrol point we have found to the Value 
input. The Key input we passin isthe new public 
variable NextPatrolPointKey we have created. 

NextPatrolPointKey is of thetype Blackboard 
Key Selector. Making it public allows usto select 
a key fromthe blackboard in the Details panel 
when this task is used in the behavior tree. 
Whatever we select becomesthe blackboard key 
this Set Blackboard Valueas Object function is 
setting. 

Finally, wecall Finish Execute with the 
Success output checked to indicatethat the 
wholetask is successful. This Finish Execute has 
to becalled tof nish thetask. If you forget to call 
it, thetask will never end, which causesthe whole 
behavior treeto get stuck. If we don't check on 
the Success output, the task is considered failed 
by the behavior tree. 

Step 8: Use FindNextPatrolPoint in the behavior 
tree. Open BT. Patrol, drag out fromthe bottom 
of thesequencenode, and search and createa 
FindNextPatrolPoint task. In the Details panel, 
you can seethe NextPatrolPointKey variable we 
created in thetask. Wehaveto makeit publicto 
seeit here. It is now set to NextPatrolPoint, which 
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means that we aresetting this blackboard keyto 
the patrol point we have found in thetask. Drag 
theFindNextPatrolPoint task to the left, so it 
becomesthef rst to execute (Figure 19.19). 
Thebehavortreenow f ndsthenext patrol 

point f rst and then movesto thenext patrol point. 

Step 9: Set up the player for testing in the storage 
room. In the World outline, search and f nd 
Player Start. Move it to the storage room. This 
player start isthe placethe player soawns when 
thegamestarts. Drag three weapon pickups in 
front of it, and set themto the pipe, gun, and the 
grenade launcher so that wecan test the Al with 
all the weapons (Figure 19.19). 
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Step 10: Add Nav Mesh Bounds Volumes. Go to the 
Place Actors panel on theleft of the window, 
search for Nav Mesh Bounds Volume, and drag it 
to thelevel. Scale it up and make it encapsulate 
the whole room. Press the P button to makeit 
build the navigation map. The green meshes 
it generates arecalled navmeshes, and Al can 
moveon navmeshesthrough the engines built-in 
navigation system. The Move To task utilizes 
the navigation system, so weneed to place 
navmeshes for it to work. Drag a few more copies 
of Nav Mesh Bounds Volumeto cover the entire 
level. Itisf neto overlap them, and press P again 
to togglether visibility of (Figure 19.20). 

Step 11: Fixthe doors. The doors are blocking the 
navmeshes. To f xit, open BP SlidingDoor and 
select all the meshesin the Components panel. 
Goto the Details pane, search for can ever af ect 
navigation, and check it of (Figure 19.21). 

Step 12: Drag a BP. Patrol to the storage roomand 
set it up for testing. Drag a copy of BP. Patrol to 


File Edit Window Help 
UAM Place Actors 


Nav Mesh Bounds Volume 


a? 
e’ Nav Mesh Bounds Volume 





AGRE 1920 AddNaeMshBuurcbVduves 


732 





SSE View c i Help 
-?- Components é | | A 2) Details 
Sj M Oa ^ »» 


+Add\Component~ fe) : can ever 
Compile Save Browse nye 
€ BP.SlidingDoor(self) 4 Collision 


Ux fe Cer IS 
x 1 Can Ever Affect Navigation m 


4 “o DefaultSceneRoot (Inherit 


AX door. door. frame 


Q door. door. | ay 
(fj, door. door. r i » i s 
E | 


AGLRE 1921 Cekd thecne«erd etraigaianfarthenedthesd'thecbar. 


the storageroom. Go to the Place Actors panel, 
search for, and drag three Target Pointsto the 
level. Selectthe BP. Patrol you placein the room, 
and go to Details panel. Add three entriesto the 
Patrol Points array under the Default section. 
Click on the eyedropper button and then pick 
thetarget points in the level to assign thethree 
target pointsto thethree entries of the Patrol 
Pointsarray (Figure 19.22). 

Play the game again and you can now see 
theAl movesto thethreetarget points in a cycle. 
And wait for 5 secondsthere before moving on to 
thenext one (Figure 19.23). 

Step 13: Fixthe animation. Currently, theAl is using 
the FPS animations, which thelegs do not 
move. Wealso don't havethe correct attack 
animation in that manner. Find the animations 
weretargeted from Mixamo and add "Patrol " 
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in front of their namesto make it easier to 
distinguish them. Figure 19.24 shows all three of 
them after renaming. 
Createan animation montagefrom 
Patrol Shooting. And don't forget to give it the 
CommitAttack animation notify. Open BP Gun - 
Patrol and replacetheldle, Walk, and Attack 
animationsto the patrol ones (Figure 19.25). 
Playthegameagain, and thistime, the Al 
should walk nicely. 


Step 14: Add a blackboard key to storethe player. 


Open BB Patrol and add a new key of thetype 
Object. Namethe new key Player and change its 
Base dassto BP Hlen FPS. 


Step 15: Makethe Al seethe player. Open 


AIC Patrol, add a new variablecalled 
PlayerBlackboardKeyName, and se itstypeto 
Name. Compileit and se thedefault valueof 
PlayerBlackboardKeyNameto Player. This name 
hasto bethesameasthe nameof thenew 
blackboard key called Player we added in Step 
14 (upper- and lowercase matters). Go to dass 
settings, and add BPI AlSeerto thelInterfaces. 
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WemadeBP AlSeer inform both the owner 
and the Al Controller of the owner when it sees 
the player. To makethis Al controller seethe 
player, we just need to go ahead and implement 
the On Seer Target Update interface function 
(Figure 19.26). 

Here, we break the stimulus input to know 
if it was successfully sensed. This Boolean istrue 
iftheBP AlSeer sees the player; itis false if the 
BP AlSeer lost sight of the player. Ifthe BP_AlSeer 
seesthe player, we se the Player blackboard 
key of the blackboard to the Target input of the 
event, which should bethe player in this case. 
Theblackboard used bytheAl controller isa 
member variable (the onein the red box), and 
wecan accessit right here. What happens now 
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is if the BP_AlSeer attachedtotheBP Patrol 
seesthe player, it calls On Seer Target Update 
onAIC Patrol. AIC Patrol then updatesthat 
information on the blackboard and setsthe 
valueof the Player blackboard keyto the player. 
ThePlayerBlackboardKeyName we supply is how 
wetell the blackboard which key we want to set. 


Step 16: Makethe Al moveto the player if it seesthe 
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player. Goto BT Patrol, and create a Selector 
node (right dick and search). Connect the Root 
nodeto thetop of the Selector node and connect 
theSequencenodeto the bottom of the Selector 
node (dick and drag the darker gray bar on the 
nodesto make connections) Drag out fromthe 
bottom of theSelector node and create another 
Move To node; makesurethat it is positioned 
ontheleft side of the Sequence node. With the 
Move To node selected, go to the Details panel, 
and set theAcceptable Radiusto 300. Under the 
Blackboard section, changethe Blackboard Key 
to Player. Playthegameonemoretime and let 
the Al see you. Onceit sees you, it should start 
following you shortly afterf nishing its current 
round of patrolling (Figure 19.27). 
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Why? 


We have covered the Sequence node. It executes 
what’s connected to the bottom of it from left to right. 
Asequence node fails if it encountered a failed task and 
aborts. A sequence only retums with success if all tasks 
under it had succeeded. 


The Selector node also executes what's connected to 

the bottom of it from left to right. The dif erence is if a 
branch under it has failed, it moves on to the next one. 

It stops whenever a branch had succeeded, and returns to 
thetop with success. A selector fails if all the branches fail. 


Sequences and selectors fall into a bigger category 
called compositors because they composite other tasks 
together. 


When the Al doesn't see the player, that Player blackboard 
key is None, and the Move To on the far left fails. The 
selector moves on to its second branch—the Sequence, 
and the Sequence does the patrolling. When the Al sees 
the player, the value of the Player blackboard key is set 

to the player. Next time the behaviortree loops back, the 
Move To on thefar left will have a valid target, and the Al 
starts to move to the player. 


The logic seems f ne except that the Al does not move 
to the player right away if it's still doing the patrolling 
Sequence. Let's f xthat with a blackboard decorator. 


Step 17: Abort patrolling when the player is in sight. 
Right dick on the Sequence node and select 
Add Decorator Blackboard. A decorator is 
something you can attach to a compositor or 
ataskto af ect its execution. The Sequence 
nodenow has a Blackboard Based Condition 
decorator attached to it. Select this new 
decorator, go to the Details panel, and set the 
Observer abortsto Both. Setting Observer aborts 
Both means ifthe condition becomes false, 
abort this node, and any lower prionty takes. 
Thecondition isset in the Blackboard section. 
Here, weset the Key Query to Is Not Set and The 
Blackboard Key to Player. The condition becomes 
true ifthe Player blackboard key is not set and 
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becomesfalseif the Player blackboard key is set 
(Figure 19.29). 

Playthegameagain, and thistime, the 
instancetheAl sees the player, it moves to the 
player. What wedo here can betranslated to 
plain English as: as long asthe Al knowsthe 
player, abort patrolling and moveto the player 
right away. 

Step 18: Createa TryCapturePlayer task. In 
the behavior tree window, dick on the 
New Task button on thetoolbar and select 
BT Task BlueprintBase. Renamethenew task 
TryCapturePlayer. Givethetask a new public 
f oat variablecalled AcceptableDistance and 
set thedefault valueto 400. Overrideits Receive 
Execute Al function as shown in Figure 19.29. 

Here, wecheck if thedistance of the 
player pawn to theAl is smallerthan the 
AcceptableDistance. If it is, wecapturethe player 
and f nish with success. If the distanceis not 
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smaller than the AcceptableDistance, we still 
f nish with success. The reason here is we just 
want to try, and if the Al istoo far, we still tried; 
keep moving on with the behavior tree and don't 
abort anything. 

Step 19: Add TryCapturePlayerto the behavior tree. 
Go backto BT. Patrol and modify it as shown 
in Figure 19.30. If you have made any wrong 
connection, you can hold down Alt and dick on 
any connection to break it. 

Here, weinserted a sequence and added 
TryCapturePlayer as the highest priority before 
MoveTo. Play the game again, and thistime, the 
Al captures you when it's dose enough. A little 
trick we did here is we set the AcceptableDistance 
to 400, that's 100 units higher than the 
Move To. Aslong asthe Move To succeed, 
TryCapturePlayer should allow theAl to capture 
the player. TheAl is now moving too fast, which 
makes the game challenging to play. Open 
BP Patrol, and select the CharacterMovement 
component in the Components panel. Go to the 
Details panel, search for Max Walk Speed, and 
changeit to 300. 

Step 20: Create an Attack task. Create a new task 
and nameit Attack. This oneisfainy simple we 
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override Event Receive Execute Al and ask the 
pawn to attack (Figure 19.31). 

Step 21: Makethe Al shoot every 2 seconds. Go 
back to BT Patrol and insert a selector between 
thef rst selector and the Sequenceon theleft. 
Drag out fromthe bottom of the new selector 
and create an Attack task; make surethat the 
Attack task ison the right of the sequence node. 
Right dick on the sequence nodeon thefar left 
and select Add Decorator TimeLimit. With 
the TimeLimit nodeselected, go to the Details 
pane and set the Time Limit setting to 2.0 
(Figure 19.32). 

Wegivethe TryCapturePlayer and Move To 
player sequencea timelimit, if the Al cannot 
reach and capturethe player after 2 seconds, 
thesequencefails and the selector moveson to 
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attack, and then the wholetree starts again. Play 
the gameagain, and this time, the Al should start 
to shoot you when pursuing. However, the Al 
stops patrolling (Why?). 


Step 22: Makethe Al go to patrolling when the player 


is not seen. Thereason the Al stops patrolling is 
becausethe patrolling part isthe second priority 
of theselector that connectsto the ROOT. As 
long asthe higher priority can be successful, the 
selector never goesto patrolling. After adding 
the Attack, the Attack task always retums with 
success. To f xthe logic, add a new blackboard 
decorator to the second selector on the left. In 
the Details panel, set the Observer aborts to 
Both, Key Query to Is Set, and Blackboard Key to 
Player. What this means is onlyto do this part if 
the Player blackboard key is set. By setting this, 
as long asthe player is not seen, the selector goes 
to patrolling (Figure 19.33). 
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Because we have set up the weapon 
properly, the Al even reloads when the gun is 
out of ammo. However, the character is siding 
during attacking and reloading. Let'sf xthat by 
improving theanimation blueprint. 

Step 23: Createa FullBody slot. Open AnimBP. Ellen, 
and goto window ^ AnimSlot Manager to 
open the Anim Slot Manager. It should appear 
at the bottom right comer of the window. Select 
DefaultGroup and click the Add Slot button. Start 
typing FullBody, and hit Enter to create a new 
dot called FullBody. 

Step 24: Create a cachefor full-body animations. 
Most of our animation montages likeattacking, 
reloading, weapon switch, and hit should all 
be happening on theupper body. After all, you 
don't need thelegsto do anything when doing 
theseactions. Theonly animation montagethat 
should befull-body isthe animation montage 
of death. 

In the AnimGraph, hold down Alt and click 
on the out pose pin of the IdleWalk state machine 
to break its connection. Moveit up, drag out from 
its out pose pin, and create a Slot 'DefaultSlot" 
node. With the new Slot ‘DefaultSot’ node 
selected, go to the Details panel and changethe 
Slot Nameto FullBody. Drag out fromthe out 
pose pin of the Slot ‘FullBody’ node, search for 
New Save cached pose, and hit Enter to create 
a SavedPose node. Renamethis new SavedPose 
nodeto FullBody by selecting it and hit F2 
(Figure 19.34). 


att Anim Slot Manage Anim Prey IdleWalk Slot 'FullBody' 
FullBody 


: E—— 4 source j — Å Pose 


Slot name filter... New Slot Name 


Slot Name FullBody “Output Pose 
(Group) DefaultGroup 
SCS ETS: 

Slo’ JllBody j——————— - 
(Group) Reaction Slot ‘DefaultSlot’ Slot ‘Hit’ 
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() source j eme Å source EH Ls d Å Result 
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Cache Pose 


The Save cached pose operation creates a cache 
(reference) of the animation. You can use this cache 
anywhere else in the AnimGraph. 


Step 25: Create a cache for upper-body animations. 
Inthe AnimGraph, right click and search for 
FullBody. Select the Use cached pose ‘FullBody’ 
to create a Use cached pose ‘FullBody’ node, 
and connect it to thein posepin of the Slot 
'DefaultSlot' node. Disconnect the out pose pin 
of the Sot ‘Hit’ node, drag out fromit, and create 
another cached pose; namethe new cache 
UpperBody (Figure 19.35). 

The Use cached pose Full Body' node gives 
you thesameanimation that connects into 
theFullBody node. Wethen passit through 
theDefault slot and theHit slot and cached 
itto a new cachecalled Upperbody. Be aware 
thatthenaming of thesetwo cachesis what 
we intend themto be. In this case, we want to 
usetheldleWalk state machine plus animation 
montages that usethe FullBody slot to be used 
onthefull-body of the character. We want 
the cached FullBody animation plustheother 
montagesto beused only on the upper body. 

Step 26: Blend the FullBody and UpperBody cache. 
Create another Use cached pose 'FullBody' node 
and a Use cached pose 'UpperBody' node. Create 
a Layered blend per bonenode (Right click and 
search). Connect the Use cached pose ‘FullBody’ 
nodeto the Base Poseinput and connect the 
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Use cached pose ‘UpperBody’ nodeto the Blend 
PosesO input. With the Layered blend per bone 
node selected, go to the Details panel, expand 
Layer Setup, and expand theO under it. This 
Osection represents how BlendPose 0 input is 
blended on top of the Base Pose input. 

Click on the “+’ sign of the Branch Filtersto 
give it a new entry named 0, open it, and set the 
BoneNameto spine 02 and the Bone Depth to 2. 
What this meansis starting fromspine 02, inthe 
next two child bones, the pose gradually blends 
from Base Poseto Blend Pose 0. Any boneafter 
two child bonesunder spine 02 (upper-body 
bones) playsthefull Blend PoseO. Any bonethat 
hasa higher hierarchythan spine 02 (lower- 
body bones) is going to play the Base Pose. It is 
herethat we maketheanimation weintend to 
play on theupper bodyto only be played on the 
upper body. Let’s also check on the Mesh Space 
Rotation Blend to avoid the of set caused by 
higher hierarchies. Mesh space means all bones 
rotation isrelativeto thelocation and rotation of 
the mesh, not their parent joint (local space). 

Finally, connect theout pose pin to 
the Result in posepin of the Out Pose node 
(Figure 19.360). 

Step 27: Set the Death From The Back Montage 
to usethe FullBody slot. Open Death From - 
The Back Montage and changeits sot to 
DefaultGroup.FullBody. We want this oneto be 
full-body. 

Playthegameone moretime, and all the 
animation should work as expected. 

Step 28: Make the healthComp notify the Al 
controller when damage istaken. It would be 
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absurd ifthe Al stands there and take damage 
from you and do nothing. And currently, it is 
doing just that. To makeit all work, weneed to 
tell the HealthCompto notify the Al controller 
when the pawn took damage. Open BP_ 
HealthComp and f nd the TakeDamage event. 
After the HealthCompNotify TookDamage 
interface call, add another HealthCompNotify - 
TookDamage, and thistime, we call it on the Al 
controller (Figure 19.37). 

Step 29: Make the Al know the player when it 
took damage. Open AIC. Patrol, go to its class 
settings, and add BPI. HealthComp as another 
interface. Implement the HealthCompNotify - 
TookDamageinterfacefunction as shown in 
Figure 19.38. 

Based on our weapon setup, the damage 
causer would bethe gun, so we need to get the 
owner and cast it to BP Hlen FPSto ensurethat 
it was the player that causesthe damage. We 
then set the Player blackboard keyto the player. 

Givethegameanother go, and thistime, 
when you shoot the Al, it starts moving toward 
you right away. 

Our Al should behave pretty well at this 
point. It pursues you relentless y once it notices 
your existence. But let's move one extra mileto 
maketheAl forget you after losing sight of you. 
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Step 30: Create a Boolean to store if the player is 
in sight or not. Add a new Boolean variableto 
AIC Patrol and nameit IsPlayerinSight. Set it to 
the Successfully Sensed output pin of the Break 
AlStimulus node in Event On Seer Target update 
(Figure 19.39). 

Step 31: Create forgetting functions that makethe Al 
forget the player. Open AIC Patrol and createa 
new custom event called StartForgettingPlayer. 
Drag out fromits execution pin, create a branch 
node, and uselsPlayerinSight asthe Condition 
input of the Branch node. Drag out fromthe 
False execution pin, search, and create a Set 
Timer by Event node. Set the Timeinput to 
10 seconds. 

Drag out fromthe Retum Value of the Set 
Timer by Event node and select Promoteto 
variableto add a new variableto AIC Patrol. 

Go to the Variables section of the My Blueprint 
pane, and changethe nameof thenew variable 
to ForgetPlayerTimer. 

Drag out fromthe Event input pin of the Set 
Timer by Event node and select Add Event ^ Add 
Custom Event to bind itto a new event. Namethe 
new custom event ForgetPlayer. In ForgetPlayer, 
wejust set the value of the Player blackboard key 
to nothing (Figure 19.40). 

Here, weused a new feature called timer, 
and the Se Timer by Event callsthe ForgetPlayer 
event after 10 seconds just like a Delay node. 
However, it also retums a timer handlethat 
allowsusto manipulatethe count down, and we 
can useitto cancel thetimer, pausethetimer, 
and query the progress. We also checked if the 
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id 
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Receiver Location 
Taq 


Successfully Sensed 





AGLRE 1939 Geteabbdentoduertredaeisinsgtana 


746 


E o / 
[3 True D [2 | —-—D 
_ œ Condition False > B Event Return Value Forget Player Timer 
f 
/ 
A 


= = aaee F z 
© StartForgettingPlayer < Branch f Set Timer by Event 
at SET 


Custom Even 


|) p Time [10.0] 
Is Player in Sight > 

©» Looping FJ 
v 


®© ForgetPlayer m fF Set Value as Object 


Custom Even 
& & 
Target 


———EE 
Blackboard @ Key Name 


Je Object Value 
Select A et w 


RG.RE 1940 GetefogttingfindiosthtnaethA fogtthedae: 


Player Blackboard Key Name @ 


player isin sight because we want the weapon 
attack to tigger this event, but wenever want 
theAl to forget the player when the player is 
in sight. 

Step 32: Create a CancelForgettingPlayer event that 
cancesthetimer. Create a new custom event 
called CancelForgettingPlayer. In this event, 
wejust get the ForgePlayerTimer, clear, and 
invalidate it by calling the Clear and Invalidate 
Timer by Handlefunction. After creating the 
event, call it afterthe Set Timer by Event function 
in StartForgettingPlayer. This call is needed to 
ensurethat the previoustimer is deared before 
adding a new one (Figure 19.41). 

Step 33: Add a call to CancelForgettingPlayer and 
StartForgettingPlayer in Event On Seer Target 
Update (Figure 19.42). 


© Cancel Forgeting Player | 


f Set Timer by Event > 


Li È / Target [ self] 


E Event Return Value Forget Player Timer 
© Time | 10.0 


© Looping O © CancelForgetingPlayer 0 J Clear and Invalidate Timer by Handle 
Custom Event > 
v in. s 
b 
Handle 


f Set Value as Object 


` Forget Player Timer 


AQF 1941 Indevet GredFoodtinlae add itate Se Tine b/Beert 


D 





P — — —. 


D 





747 


Credting GermeswthU'red Engine Substene Parte, &lMVaya 


©} Cancel Forgeting Player 


PO RET OT ERT TSG Ue 
©} Event On Seer Target Update O 
From BPI AlSeer 


- : 
Blackboard 


p —— ^ 
Player Blackboard Key Name TE 





AGRE 1942 Atad toGndFacstinflae adSatfagstinag inet Sar Eos Ute 


Here, wef rst cancel forgetting the player 
in the beginning becausethe perception has 
updated. We call StartForgettingPlayer if the 
Successfully Sensed is false, which means that 
the Al starts to forget the player at the moment it 
lost sight of the player. 

Step 34: Add a call to CancelForgettingPlayer and 
StartForgettingPlayer in Event Health Comp 
Notify Took Damage (Figure 19.45). 

Wehavesimilar logic here, and we cancel 
forgetting the player when the Al took damage 
fromthe player. But westart forgetting the 
player right away after getting hit becausethere 
isno guarantee that the AIl seesthe player right 
away after hitting bythe player. 

Alrighty, wehavef nallyf nished the 
patrolling Al. Figure 19.44 shows all thefeatures 
weimplemented. 
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Al remmebers the player even behind door or too far away 
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Conclusion 


We have made a quite compiling Al, and you can see how 
the dif erent systems we have built can tie together. Let’s 
count these systems: 


L. 


N 


Character. The character is the core system that all 

the other systems are built around. It can attack, take 
damage, die, and play various animations. 

Weapon system. Weapon system takes care of 
outputting damage and hold weapon-specif c 
animations. 

Animation system. The animation system drives 
character animation and helps drive weapon logic. 
Health System. BP_HealthComp takes care of receiving 
damage, notify damage, and death to its owner. 
Perception System. The perception system informs the 
owner and its Al what it sees. 

Al. The Al drives the behavior of the enemy. 

Ul. Ul shows the status of the game. 


All these systems have their unique structure and are 
talking to each other to make the whole game work. 
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As your game becomes bigger and more complicated, it's 
going to get harder to keep track of everything. Making 
these systems simple, f exible, and elegant becomes more 
and more important as you progress. 


Let's move on to the next chapter that we can quickly 
build a bossfor our game. 








Welcome to the chapter of the boss! It never feels more 
exciting than the player f nally meets the boss, and we 
are going to have more fun in this chapter to create our 
boss. We will tie our systems together and make the boss 
f ght both fun and challenging. But before we move on 
to that, let’s again have alist of things we want the boss 
to do: 


1. The boss takes the form of the hero asset. 
2. Whenthe boss sees the player, it locks on the player 
and always facing the player. 
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3. The bossstarts to shoot grenades toward the player 
every 3 seconds. 

4. The boss spawn minions behind it every 8 seconds. 

5. Bossminion isa child class of BP Patrol that never 
forgets the player and spawn grenade launcher 
pickups when dead. 

6. There are four health regenerations at the four comers 
around the boss. 

7. Boss explodes when dead, kills all minions, and 
spawns a “you win!" sign. 





Let's start assembling the boss right away! 


Tutorial 20.1: Create the 
Boss Class 


Step 1: Assemble boss visuals and create hierarchy. 
Createa new folder called Bossin the blueprints 
folder and createa new class called BP. Boss 
derived fromthe Actor class. Open BP. Boss, 

f ndall thestatic meshesof the hero asset in 

the content browser, and drag themto the 
Components panel of BP Bossto add themas 
components, make suretheir Mobility are all set 
to Movable. Add a new Scene component to it 
and namethe scene component RotationPivot. 
In the Details panel, set the Location Zto 320 and 
Rotation Zto 90. This RotationPivot should now 
at the center of the sphere of the body and has 
itsforward axis (X-axis) facing forward. Parent 
all the meshes of the spherical part of the boss to 
RotationPivot (Figure 20.1). 

Step 2: Add SeerRef and Spawn BP. AlSeer. This step 
isalmost the same as how we set up the SeerRef 
and BP_AlSeeron BP Patrol. Theonly dif erence 
here isthat we attached SeerRef to RotationPivot 
and moved it forward to position it at the eye 
(front circle) of the boss. 

For thesetting of the SeerRef, we set its inner 
and outer coneangleto 50 and the attenuation 
radiusto 5000. These settings are set to ensure 
that the boss seesthe player when the player 
entersthedoor. When you aredone, replacethe 
model in theboss room with BP Boss, drag the 
player start and thethree weapon pickupsto 
the boss room, and test it (Figure 20.2). 
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Step 3: Makethe boss know the player when the 
player isin sight. Add a new variable called 
Player and set itstypeto BP Hlen Baseobject 
reference. Add the BPI. AlSeer interfaceto 
BP Boss and implement Event On Seer Target 
Update as shown in Figure 20.3. 

Here, we just set the Player variableto the 
Target sensed by BP. AlSeer. 
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Step 4: Makethe boss look at the player. Add a new 
f oat variable called RotationSpeed to BP Boss, 
and set its valueto 5. Createa new custom event 
called TryLookAtPlayer, and call it in Event Tick 
(Figure 20.4). 

Here, wef rst check ifthe variable Player 
is valid. Then wef ndtherotation needed for 
RotationPivot to look at the player. Wehave 
donethe samething when doing the player 
Surrender code. 

Wethen called a Rinterp To function. This 
function retumsa rotation between the Current 
and Target input based on the Interp Speed and 
the Delta Time you supply. The higher the speed 
isand thelongerthetime you supply, the doser 
the Retum valueisto the Target input. 

FortheDelta Time, weusethe Get World 
Delta Seconds, and this is again thetimeit took 
between thelast frame and the current frame. 
Weuse Get World Delta Second because weare 
calling thisfunction in Event Tick. This way, the 
timefortheinterpolation is realtime. 
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Finally, we set the rotation of RotationPivot 
to the Retum Value. 

Givethegameanother go, and thistime, 
the boss should start looking at you right away. 
Noticethat becausethere is a speed limit, the 
rotation of the boss hasa nicelagging ef ect. This 
lag is necessary because, otherwise, the boss can 
alwayshit you (Figure 20.5). 


Step 5: Add a health bar. Add another scene 


Why? 


component to BP Bossand nameit 
HealthBarPivot. Rotateit 90 degreesto make 

its X-axis facing thefront of the boss. With 
HealthBarPivot selected, add a new widget 
component and nameit HealthBar. Go to the 
Details panel, and set the Widget Class to WBP - 
HealthBar. Move HealthBar forward, and scaleit 
down on the Zaxisto f atten it (Figure 20.6). 


So why do we create a HealthBarPivot? Well, because we 
want the player always to see the health bar. To achieve 
that, we need to make it rotate around the center of the 
boss. The boss blocks it if we look from behind the boss. 


Step 6: Set the appearance of the health bar. Add 


the codehighlighted in Figure 20.7 at the end of 
Event BeginPlay. 
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Here, we just set the material used bythe 
health bar to EnemyHealthBar MIt Inst. 

Step 7: Makethe health barfacethe player. 
Implement a new custom event called 
RotateHealthBarToPlayer, and call it at the end 
of Event Tick (Figure 20.8). 

Here, wef rst check if the variable Player is 
valid, and then makethe HealthBarPivot rotate 
toward the player. 

Step 8: Add BP. health Comp and update health bar. 
Add a BP. HealthCompto BP Boss, and in the 
Details panel, set the Max Health and Current 
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Health to 1000. Add the BPl. HealthComp 
in the class settings and implement the 
HealthCompNotify UpdateUl asshown in 
Figure 20.9. 

Wejust updatethe health bar the same 
way wedid on BP. Patrol. Playthegame 
again, and the health bar should update nicely 
(Figure 20.10). 

Now we havecreated the basics of the boss, 
let's moveon to makeit attack. 


Tutorial 20.2: Boss Attack 


Step 1: Createa grenade spawn point. Select 
RotationPivot in the Components pand, and add 
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a new scene component to it. Moveit forward, 
so it has enough distancefromthe bossfor the 
grenadeto spawn (Figure 20.11). 

Step 2: Create a StartShootingGrenade function as 
shown in Figure 20.12. And call it at the end of 
Event On Seer Target Update. 

First of all, wecreated two new f oat 
variables. Thef rst oneiscalled Shootinglnterval 
with a default value of 3, the second oneis called 
DirectionRandomness, and its default valueis 0.1 

Forthefunction, we start calling a 
Delay with the duration of ShootinglInterval. 
This way, the boss does not start shooting 
right away; wethen spawn a grenade at our 
GrenadeSpawnPoint and ignite it. Wethen go 
backto the Delay again to repeat the process. 

FortheFire Direction, wef rst get the 
forward vector of the GrenadeSpawnPoint. 
Wethen add it with somerandomunit vector 
multiplied by our DirectionRandomness variable. 
The Random Unit Vector node retums a vector 
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© StartForgettingPlayer 
<< Branch 


| i 2 True > 
Condition False [5 


— 
Should Forget Player 





as Player in Sight 
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that hasa randomdirection and hasa length of 
lunit. We have madeit smaller by multiplying it 
with DirectionRandomness (by using a vector * 
f oat node), so it has a lesser ef ect on thef nal 

f redirection. The Retum Value of the Normalize 
nodeisa vectorthat hasthe same direction as 
the A input and hasa length of one. We need 

to normalizeit to ensurethat the speed is not 

af ected by it. 

Wedid not show it in thef gure, but please 
call thisfunction at the end of Event On Seer 
Target Updateto seethe ef ect. Givethe game 
another go. And the boss startsto shoot you. 

Step 3: Set a Booleanto def neif wewant an Al to 
forget the player. We want the minion of the boss 
neverto forget the player. To achievethat, we 
need to modify our AIC Patrol. Open AIC. Patrol, 
add a Boolean variablecalled ShouldForgetPlayer, 
and set its default valueto true. At the beginning 
ofthefunction StartForgettingPlayer, add 
a Branch nodewith ShouldForgetPlayer to 
onlyallowtheAl to forget the player when 
ShouldForgetPlayer istrue (Figure 20.13). 

Step 4: Create a BP Boss Minion dass. Createa 
new dasscalled BP Boss Minion derived from 
BP Patrol. Open BP Boss Minion; inthe Cass 
Defaults, set the Loot to BP GrenadeLauncher. 
Select its BP HealthComp in the Components 
panel and se the Max Health to 20 and current 
health to 10. 


Why? 


First of all, the ammo is pretty limited in the game, and 
we set the health of the bossto 1000; we need to give 
the player more ammo, but that should not come free. 
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So, we make the boss spawn minions that pursue the 
player. However, when the player kills a minion, a grenade 
launcher pickup is spawned, which allows the player to 
replenish ammo. 





Second, the default health of the BP Patrol istoo much 
to handle while f ghting the boss; lowering it down helps 
to make the game easier. We also made the health half 
full. This way, there is a chance that these minions can 
consume the health regenerations that we will place 
around the boss later on. 


Step 5: Set the minions not to forget the player and 
let them know the player when they spawn. 

In BP Boss Minion, add thecodeshown in 
Figure 20.14 to Event BeginPlay. 

Here, weget theAl controller and set its 
ShouldForgetPlayer to falseso that the Al 
never forgetsthe player. Wethen set the Player 
blackboard key to the player to let theAl know 
the player's existence. 

Step 6: Add a sphere component to indicate the 
spawn parameter of the minions. Open BP Boss, 
add a new Sphere Collision component, and 
nameit MinionSpawnPerimeter. This component 
isintended to be used asa collider or a trigger. 
However, we just want to useit so we can 
visualizethe spawn parameter of the minions. 
Goto the Details panel and set its Collison 
Presetsto NoCollision. Set its Sphere Radius 
to 800, so its outer perimeter in thelevel is not 
blocked by anything (Figure 20.15). 

Step 7: Create a function that gets a spawn 
transformfor the minions. Create a new 
function called GetMinionSpawntransform, 
give it an output called SpawnTransform, and 
set thetypeto Transform. Mark the function as 


©} Event BeginPlay ©} Parent: BeginPlay »* Cast To AIC Patrol = 
a Ee Ld Ld P» —-h 
Object Cast Failed D Should Forget Player (C) 


J Get AlController As AIC Patrol 


SET 


Target 
Controlled Actor Return Value 
Target Blackboard 


Target Player Blackboard Key Name 


J Get Player Pawn 





Player Index [0] ^ Return Value 
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pure, and implement the function as shown in 
Figure 20.16. 

We haveto squeeze it horizontally to make 
itf tinto this book. Starting fromthetop-left 
comer, we get the location of the boss and 
thelocation of the player and break thesetwo 
vectors using the Break Vector node. Wethen 
madea new vector that hasthe X, and Y from 
the boss, but the Z (height) fromthe player. This 
new vector then hasthe height of the player, but 
X, Y, location of the boss, wethen usethis new 
vectorto subtract the location of the player. The 
subtraction would then bea horizontal vector 
pointing fromthe player to the boss (why?) 

Wethen normalized the result of the 
subtraction to get a unit vectorthat again 
isa horizontal vector pointing fromthe 
playerto the boss. This normalized vector 
then got scaled(multiplied) by the radius of 


4 Outputs 
SpawnTransform Ai x 
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MinionSpawnPerimeter. Wethen add it with the 
vector that hasthe X, Y location of the boss, but 
height of the player. This resulting location would 
bethelocation on the other side of the boss 
(redativeto the player) that is on the perimeter of 
MinionSpawnPerimeter and hasthe same height 
asthe player. 

Thewholecalculation throws out the height 
of theboss, and all vectorsusetheheight of the 
player. This way, wearecalculating horizontally 
and ensuresthat the spawning location isthe 
sameheight asthe player. 

Step 8: Add a new float variable called 
MinionSpawninterval, and set its default value 
to 8. Create an event called StartSpawnMinions 
and implement it as shown in Figure 20.17, 
and call it at the end of Event On Seer Target 
Update. 

Justlikehow wedid the 
StartShootingGrenade event, we start with 
a Delay with our MinionSpawnlnterval. 

Wethen check if we havea valid player 
because the GetMinionSpawntransform 
uses the player's location. We then usethe 
GetMinionSpawntransform function we 

did in the previous step to get a Spawning 
transform, and wespawn a BP Boss Minion. 
Theevent then goes backto the Delay node 
and repeat. 

Playthegameagain, and thistime, you 
should seea BP Boss Minion got spawned 
behind the boss every 8 seconds (Figure 20.19). 

With the bossf ring grenade, and the 
minions pursuing you, it is pretty tough to win; 
let's add some BP. HealthRegensto the room. 

Step 9: Add four BP HealthRegens at thefour 
comers of the boss (Figure 20.19). 





StartSpawnMinions 
P — 
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Completed B» ——— B» Exec IS ET EE 1 


Duration Input Object Is Not Valid > Class Return Value 
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All right, that was all the boss-attacking 
part; let's make the boss die when it's out of 
hit points. 


Tutorial 20.3: Boss 
Death and Winning 


Step 1: Enablethe APEX Destruction plugin. Press the 


Save All button in the Content Browser to save 
all the work wehavedone. Go to Edit > Plugins 
to open the Plugins window. In the search bar to 
thetop right corner, search for APEX Destruction, 
and there should beonly one search result 
called APEX Destruction. Check on the Enabled 
option of the plugin, and click on the Restart 
Now button that pops up. The project restarts 
and loadsthe plugin. We want to usethis APEX 
Destruction plugin to blow up the boss when it's 
dead (Figure 20.20). 


Step 2: Import the combined mesh of the boss. In 


the support f les, we havesupplied a mesh called 
Boss Combine, and this onehasall the models 
of the boss merged. Import it to the hero folder 
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of the StaticMeshes folder, and assign the correct 
material. 

Step 3: Create a Destructible mesh. Right dickon 
theimported Boss Combine static mesh and 
select Create Destructible Mesh; the plugin then 
creates a new asset called Boss Combine DM 
(Figure 20.21). 

Step 4: Fracturethe destructible mesh. Open 
Boss Combine DM, and dick onthe Fracture 
Mesh button to fracture it. The fracturing process 
isgoing to take sometime because our model is 
a bit complicated. Unreal is going to freezefor a 
whileas well (Figure 20.22). 


fF Level Of Detail 
Remove Vertex Colors 
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Step 5: Create a boss blow up actor. Create a new 
class derived from Actor in the Boss folder and 
call itBP Boss Blowup. Open BP Boss Blowup 
and drag the Boss Combine DM fromthe 
Content Browser to the Components panel of 
BP Boss Blowupto add it as a component. 
Step 6: Add a “YOU WIN!” label. Add a Text Render 
component (dick on Add Component and 
search). Text Render component is, well, a text. 
With this Text Render selected, go to the Details 
panel, changethe Text to “YOU WIN!”, set the 
Horizontal Alignment to Center, and set the Text 
Render Colorto an energetic orange. Drag the 
TextRender up and scaleit, so it's about the same 
size as the model (Figure 20.23). 
Step 7: Implement the explosion, VFX, and rotation 
ofthelabel. In the Event Graph, implement Event 
BeginPlay and Event Tick as shown in Figure 20.24. 
In Event BeginPlay, weapply a tremendous 
amount of damageto the destructible mesh. 
Theplugin works with the damage system, so 
wejust need to apply damageto blow it up. Both 
the Damage Amount and Impulse Strength are 
set to 50,000. The GetActorBounds give us the 
bounding boxorigin and extend of this actor. 
Weusetheorigin of the bounding boxastheHit 
Location, so theimpulsestartsfromthe center of 
the whole actor. 


+ Add Component ~ 


€ BP Boss Blowup(self) 


Af, DefaultSceneRoot 
15 Boss Combine DM 


A Text 


Text YOU WIN! ox 
Horizon ICI Iris Center v Ns 
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The Impulse Dir is set to the reversed right 
vector (Y-axis) of theactor. If you look at it in the 
viewport, you can seethat the Y-axis is pointing 
at thefront of the mesh. We use the reversed 
direction (multiplied by 31) of the Y-axis asthe 
Impulse Dir to push it backward. 

Wethen spawned an explosion VFX. Here, 
we makethe VFX ten times bigger to make it 
look like a bigger explosion. Finally, weset the 
visibility of the TextRender to invisible at the 
beginning and makeit visibleafter 2 seconds. 

In Event Tick, wesimply makethe Text 
Render rotate. 

Step 8: Implement the death of the boss. Implement 
theHealthCompNotify Dead event as shown in 
Figure 20.25. 

Here, wedestroy Seer f rst and then spawn 
ourBP Bose Blowup atthetransform of the 
boss. Wethen call the Get All Actors of Classto 
get all the actors that areof type BP. Patrol and 
it's child classes. Weloop through all of them and 
tell themto die. Finally, we kill the boss. 


E 
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b | 2L 2 | — D Exec LoopBody P» — P D 
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Play the gameand try to beat the boss and 
you see it explodes and shows the “YOU WIN!" 
text afterward (Figure 20.26). 

It feas pretty good tof nally seea “YOU 
WIN!” sign after a brutal f ght, and this also 
marks the end of thetutorials for this chapter. 
Figure 20.27 shows all the mechanics we have 
Implemented. 


Conclusion 


Surprisingly, implementing the boss does not take long. 
You can probably f nish it in a morning, half of a moming 
even. For the most part, we were just assembling the 
various components and features we have built before. 
The whole point of why we carefully design and separate 
dif erent parts of the game is for their ease of use and 
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reusability. A grenade launcher is a grenade launcher, and 
a grenade is a grenade. If we don't logically separate them 
into two actors, it would be dif cult to make the boss 
shoot the grenade. Our BP healthComp, BP AlSeer, and 
WBP HealthBar are all reusable in this manner. 


Alrighty, we have f nished the boss programming at 

this point and all other gameplay programmings as well 
(YEAH!!). However, there are still things to do before we 
f nish the game. To name a few, we haven't done any 
audio work yet! Let's move on to that and add more VFX 
in the next chapter. 





Audio and VFX 





Hello, and welcome to the chapter of Audio and VFX. 
In this chapter, we are going to explore how to use 
audio and add additional VFX to our game. There is a 
well-known joke in this industry: 


No onecares about audio. 


Although audio is not exactly crucial to many types of 
games, it is a part that cannot be ignored. Often times, 
audio does make a huge dif erence. We don't have the 
luxury to talk about how to record audio from scratch, but 
luckily, there are plenty of free assets you can f nd online. 
Just make sure that you look for royalty-free sounds. 
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The license can be tricky some times, although the asset is 
free, many authors require attribution, so you have to give 
them appropriate credits. 


Putting audio to Unreal Engine is also a trivial task. In 

the support f les, we have a folder called Audio; drag the 
folder to the root of your Content Browser to import them 
all. After importing, you can hover the cursor on them and 
hit the play button to play them. 


Let's explore a few ways to add audio to the game. 


Tutorial 21.1: Add Audio 
to the Game 


Step 1: Add audio to the main menu level. Go to the 
Level folder and open SartMenuL evel. This oneis 
theentry map of thegame. Go backto theAudio 
folder, and drag the audio asset called Menu to 
theleve (Figure 21.1). 

Play the game, and you should hear the 
audio right away. 
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Step 2: Add an audio component to the sliding door. 
Go back to Level. O1 Awaken. And open BP__ 
SlidingDoor. Add a new Audio component. In the 
Details panel, in the Sound section, set the Sound 
to door open. Play the game, and you should 
hearthe door opening sound right away. 

Step 3: Kop playing the sound at the beginning. 

To stop the door from playing the sound right 
away, add the code shown in Figure 21.2 to Event 
BeginPlay. 

Step 4: Makethe door playthe sound when starting 
to open or close. Insert the code highlighted in 
Figure 21.3 at the beginning of Event Overapped 
and Event UnOverlapped. 


Why? 


Play the game, and the sound should only play when the 
door is opened. However, if you are using the project f le 
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we provided, you can still hear the door opening sound 
randomly. That extra sound you hear is another door 
faraway and triggered by a patrolling Al. In the default 
settings, audio assets have no attenuation. Let's f xthat in 
the next step. 


Step 5: Add attenuation to thedoor open audio. 
In the Content Browser, open door. open. Scroll 
down and f nd the Attenuation Settings. Click on 
the drop-down list and select Sound Attenuation 
under Create New Asset. In the pop-up Save Asset 
As window, open the Audio folder. In the Name 
text f eld, typein NaturalSoundAttenuation 
and hit the Save button. A new asset called 
NaturalSoundAttenuation appears in the Audio 
folder. Open it, and set its Attenuation Function 
to Natural Sound (Figure21.4). 

Any other audio assetscan usethis new 
NaturalSoundAttenuation. And the ones who 
use NaturalSoundAttenuation is going to have 
a natural fall-of based on distance. We need all 
other audiosto have natural fall-of as well. Go 
ahead and set the Attenuation Settings of all 
other audios to NaturalSoundAttenuation. 

Step 6: Create a footstep cue. To makethe footstep 
work, we need to makeit repeat. Right click 
on footstep and select Create Cue. A new asset 
calledfootstep Cue got created. Audio Cueis 
theBlueprint for audio, open footstep Cue, and 
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you can seea graph in the middle with footsteo 
connected to the Output (Figure 21.5). 

J ust like any other Blueprint, you can right 
click and search to create new nodes in the graph 
of a Cue, and thereare plenty of nodes you can 
add to alter your audio. 


Step 7: Makethe audio repeat with a delay. Create 


a Delay nodeand a Looping node, and connect 
themas shown in Figure 21.6. 

Select the Delay node, go the Details 
panel, and set the Delay Min and Delay 
Maxto 0.1 so that the Delay node delaysthe 
audio for 0.1 seconds beforethe next loop. 
TheLooping nodeloops what's connected to 
it. Select the Output node, go to the Details 
pana, and set the Attenuation Setting to 
NaturalSoundAttenuation. Press the Save button 


to savethe change. 


Step 8: Set up footsteps. Open BP_Character_Base, 
add an Audio component to it, and renamethe 
component Footsteps. With Footsteps selected, 
go to the Details panel and set the Sound to 
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footstep Cue. Go to Event Graph and add the 
codehighlighted in Figure 21.7 in Event Tick. 

Here, weget the velocity of the character 
andthen wemultiply it with another vector that 
is (1, 1, 0). We do this multiplication because we 
only careabout the horizontal velocity. Wethen 
get thelength of the vector, which isthe speed. 
We compare the speed with 100. On the bottom 
of thegraph, weget the Character Movement 
component and ask if the character is falling. 

If the speed is higher than 100, and not in 
falling (jumping in theair), we set the volume 
multiplier of thefootstep to 1. If not, we set it 
backto 0. The volume multiplier weare setting 
is used to scalethe volume of the footsteps. Our 
setup makes the volume of the footsteps O when 
the character is not moving, isfalling, or moving 
slow (Sower than 100 units per second). 

Play thegameagain, both the player and 
the patrols should have correct footstep sounds. 

Step 9: Makethe came rolling cue. Create another 
audio cuefromcamera roll. Open it and 
add a Looping node, and don't forget to set 
its attenuation to NaturalSoundAttenuation 
(Figure 21.8). 

Step 10: Add camera roll sound to BP _ 
SecurityCamera. Open BP. Camera and add an 
audio component to it; namethe new audio 
component RollingAudio. Set the sound of 
RollingAudio to camera roll Cue. Add a new 
f oat variablecalled volume and set its default 
valueto 0.05. Find the StartRollingCamera event 
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and add the code highlighted in Figure 21.9 at 
theend of it. 

Here, weleveragethetimelineto determine 
the volume of the camera rolling sound. 
However, the Lerp rangesfrom Oto 1, but we 
want the sound to changefrom Oto 1 and back 
to Oagain. To achievethat, we need to remap 
a 0-1rangeto a new rangethat is 0- 1- O. 

If you havestudied thesine wave, you know it 
is perfect for this purpose. Wef rst remaptheLerp 
output value go 0-180 by multiplying it to 180. 
Wethen passthat valueto a sine (Degrees) so that 
the output of the INd node becomes sine (0)- sne 
(180), which isthef rst half of thesine wave. 

Weknow that thef rst half of a sinewave 
rangesfromOto 1 and backto 0, but wedamp it to 
0-0.3tof atten thecurve By doing thef attening, 
thevolumeinthemiddlestays constant. Finally, we 
multiplytheresult of thedamp with our volumeto 
scaleit asoneextra adjustment. 

As you can see, math is a benef cal tool in 
programming. But don't get too scared about it, 
because you are not calculating it! In the world 


J SetRelativeRotation 


>= z sÉ = 
A PASA rt e 
| © CameraRollingAnimationLerp 


| Play Update > eee È 
" ) 
D Play from Start Finished B» —— a . — = Target 
Security Cam Security Cam Yaw Handle Geo 
"E Stop Direction > New Rotation X (Roll) [0.0 ] 
D Reverse Lerp & - New Rotation Y (Pitch) 
[fT " > — 
Ba ® Reverse from End Camera Left Reach @ Jf Lerp 0.0 j 
- verse 
e A Return Value @ @ New Rotation Z (Yaw) 
D Set New Time EEE 
Camera Right Reach @ B \/ 
» New Time [0.0 ] 


2) Details 
Search Details 
4 Variable 
Variable Name [voume — | 
Asin (Radians) 


ES 
4 Default Value Volume @ 





AGLRE 219 Cobabkdd theedd SatRilinef area 


775 


Greeting Greswth Urad Engine Suostane Parte, &i Vaya 


776 





Ellen_FPS_Pipe Attac 
^ 0-20) (29 099) 
4 Notifies 
1 
Curves (0) 


Additive Layer Tracks 


ACI IN 
, New Notify... 


; : s ; fy State... 
1) Details i) Preview SceneSe 7” Bo: 
s Marker... p Skeleton Notifies 


Search Details p © H 
——- Notifies... 


4 Anim Notify 
Q Pause Clothing Simulation 


Notify O Play Niagara Particle Effect 
O Play Particle Effect 
pipe-vhoosh v O Play Sound 
Ae— e 9 O Reset Clothing Simulation 
e Nd j 





Sound 


AGURE 2110 Actithede whoohsoudintredien PS Ape Atak 
arinatiaesenanrinatianndify 


of programming, math islikea religion that you 
either believeit or not. You just haveto know 
what a math calculation gives you, but you do 
not haveto understand how it worksthings out. 
Playthegameagain, and you shall hear a 
subtle robotic arm rolling sound fromthe camera 
when it's rolling. 
Step 11: Add sound to the pipe attack. Go to our 
animations folder, f nd and open Hlen FPS _ 
Pipe Attack. Inthetimeline, f nd thetimethat 
thepipestartsto go down, right click, and select 
Add Notify Play Sound. With the new Play 
Sound notify added, go to the Details panel and 
set the Soundto pipe whoosh (Figure 21.10). 
Givethegame another go, pick up the pipe 
and attack, and you shall hear a “whoosh!” sound. 


Tips and Tricks 


If a sound is destined to happen with the animation, we 
add it to the animation through animation notify. 


Step 12: Add the pipe hit audio. Open BP. Pipe, 
and f nd the Event Commit Attack Anim Notify. 
Changethe Actor Class Filter to BP Character - 
Basein the SphereOverlapActors node. This 
setting guarantees that the pipe only hits the 
patrol. You could argue that the player would 
tryto hit the boss with the pipe, but it would be 
strangeif a pipe could hurt a giant machine like 
that. Add thecode highlighted in Figure 21.11 to 
theend of the event. 
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Here, wesimply playthepipe hit sound at 
thelocation of thehit actor. Play the game and 
hit the patrol next door with the pipe, and you 
should hearthehit sound. 


Tips and Tricks 


If a sound should only happen with a specif c event, play 
the sound in that event. 


Step 13: Add hit reaction and falling sound to the 
death animation. Open the Death From _ 
The_Back animation. Thistime, we add two 
animation notif es. Thef rst one isthe Dead 
sound at the point when the character starts to 
struggle. The second oneisthe body fall_on_ 

f oor sound, which happens at the point that the 
body falls on the ground (Figure 2112). 

Step 14: Add the rest of the sounds. For the rest of 
the sound, they are added the same way, just 
makesurethat you f nd the proper placeto add 
it. When you need control of the sound during 
gameplay, you create an audio component. 
When you just need the sound to play once, 
you add it asan animation notify or play it 
somewherein Blueprint. When you need more 
adjustment to the audio, you create a Cue. There 
are plenty of soundsin the support f les; make 
surethat you take advantage of them. 

Alrighty, onelast thing to go beforewe wrap 
thisup. Wehavea few more VFX assets wecan add 
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tothegame We only did theaitical ones beforeso 
that wecan seethe behavior of the weapons; now 
let'saddtheadditional ones real quick. 


Tutorial 21.2: Add Extra 
VFX to the Game 


Step 1: Add a gun muzzle socket. Open gun Gun - 
body, and create a new socket called Muzzle. 
Placethenew socket at the front of the gun 
wherethe bullets comeout (Figure 21.13). 

Step 2: Import the gun muzzle VFX asset. In the 
support f les, there is a new asset called NS. Gun - 
Muzzle_Sparkle.uasset. Copy it, and paste it to 
the VFX folder in the Content folder of your game 
project. Beawarethat wearenot importing it 
through the engine. We are just copy-pasting 
(Figure 21.14). 

Whenever you have an asset that is with the 
extension.uasset, you copy-paste it to the folder 
of your content browser to add it to your project. 

Step 3: Add the muzzle ef ect. Open BP Gun, and 
add the code highlighted in Figure 21.15 to the 
end of Event Commit Attack Anim Notify. 

Here, wespawn NS Gun Muzzle Sparkleat 
the location of the Muzzle socket. 

Step 4: Create a grenadetrail class. There isa particle 
ef ect called Projectile back f rein the VFX 
folder, open it, and you can see that it has two 
emitters. One of the emitters is named Flames 


PY Socket Manager 


Create Socket 
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and isin charge of emitting f ames. The other 
oneis emitting smoke and named Smoke. 

Createa new blueprint dass derived from 
Actor and nameit BP Grenade Trail. Open 
BP Grenade Trial and drag Projectile back f re 
to its components to add the VFX asa new 
component. Add the code shown in Figure 21.16 
to its Event BeginPlay. 

Here, we bind a new event called 
StopFireAndStartDisappearing to the On 
Destroyed event of the owner. This Bind 
Event to On Destroyed is very smilarto the 
Bind Event to On Take Any Damage we did in 
BP HealthComp. Thedif erence hereisthat 
this SopFireAndStartDisappeaning is bond 
to the destruction of theowner instead of 
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taking damage. When the owner is destroyed, 
StopFireAndSrartDisappearing is f red. 

In StopFireAndStartDisappearing, we 
disabled the two emitters we have seen earlier 
in Projectile back f re, delayfor 3 seconds, and 
then destroy self. 

Wedid all this because wedo not want the 
VFXto just disappear at theinstancethat the 
grenade explodes. Instead, we want thef ame 
and the smoketo stop emitting, but keep the 
already existing smokefor another 3 seconds. 

Step 5: Spawn and attach a BP. Grenade Trial 
when the grenade ignites. Open BP Grenade 
and add the codehighlighted in Figure 2117 at 
the end of the Ignite custom event. 

Here, wesimply spawn a BP Grenade Trial, 
Set its owner to self, and attach it to the mesh. 


- .f AttachActorToComponent 


J Play Sound at Location @ SpawnActor BP Grenade Trail 


Sound Return Value 


[ Location @® Spawn Transform 


Collision Handling Override 


J GetActorTransform 


Owner 


Target | self ] Return Value @ Instigator 


Static Mesh 
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Target 


Parent 


©» Socket Name [None] 


Location Rule 
Snap to Target M 


Rotation Rule 
Snap to Target d 


Scale Rule 


Snap to Target v 


©» Weld Simulated Bodies J 





Playthegame again, and this time, we 
should see both the gun and the grenade have 
some cool looking trail ef ects (Figure 21.18). 


Step 6: Makethe grenade apply impulse when hit. 


Onemorething we want to add to the grenade 
isto allow theexplosion push dynamic objects 
away. Open BP Grenade and implement 
a new custom event called Applyimpulse 
(Figure 21.19). 

Theevent task an actor asinput. We get 
theroot component of the actor and cast it to 
a PrimitiveComponent. PrimitiveComponent 
isthe parent dass of all componentsthat has 
a shape, and components like static mesh and 
skeletal mesh are all child classes of it. We can 
then check if it is simulating physics. If it does, we 
add impulseto it. A critical notehereis you want 
to check on Vel Change: this way, the velocity we 
supply as Impulse becomes the new velocity of 
theactor, so we don't have to worry about mass 
(Figure 21.19). 
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Step 7: Call Applyimpulse at the beginning of On 
Component Hit (Figure 21.20). 

Here, after making surethat thehit actor is 

not theowner, wecall Applylmpulse. 

Step 8: Makethe boxes simulate physics. Select 
any box you want to receivetheimpulsein the 
World Outliner, go to the Details panel, change 
its mobilityto Movable, and check on Simulate 
Physics. You can search the World Outliner to get 
all the boxes (Figure 21.21). 

Play the game, get a grenade launcher, and 
shoot these boxes. You should now seethem 
getting blown away. The bosscan also blow 
these boxes away, which makes the game more 
interesting to play (Figure 21.22). 

After setting these boxes to be movable it is 
wiseto rebuild the lighting again. 
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Conclusion 


Alrighty, we have now f nished with our audio and VFX. At 
this point, we can f nally call our game f nished. However, 
the game lives in the editor unless we package it, let's 
quickly cover that in our f nal chapter - packaging. 
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Packaging 





Welcome to this quick f nal chapter, where we package 
our game. 


Packaging agame is atrivial process in Unreal Engine. We 
just need to make sure we set up the correct startup map, 
icons, splash images, and f II in the necessary information 
about the game. 


There aretwo possible platforms you can try without 
paying for a developer license: Windows and Android; 
Apple iOS does require a paid developer account at the 
moment. However, our whole game is built based on 
the Windows platform; so we are not going to cover an 
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4 Project - Description 


fla These settings are saved in DefaultGame.ini, which is currently writable 


4 About 


Project Thumbnail 


Description 
Project ID 
Project Name 


Project Version 
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Android build. Most of the dif erences between platforms 
are the graphics, inputs, and necessary development kit 
for the targeted platform. 


J ust keep in mind that if you are building for Android in 
the future, you need the Android Software Development 
kit installed. 


Let’s move on to build our game for Windows. 


Tutorial 22.1: Package the 
Game for Windows 


Step 1: Fill in descriptions. Open Edit > Project 
Settings and go to the Description section. Under 
the About section, typein “An escape game’ in 
the Description text f eld. Typein thename of 
your gamein the Project Nametext f eld. In our 
case, it is TheEscaper (Figure 22.1). 
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Thedescniption is whatever you want to 
write down to describe your game. What'sin 
the Description text f eld is just information 
and does not change any aspect of the game. 
Here, wejust type in An escape game. 

For the Project Name it is going to bethe 
nameof your game executable. 

Thereareother parts you canf Il in with 
information. Likethe company name and 
Homepage, but they areoptional. 

Step 2: Set up maps and modes. Go to the Maps & 
Modes section. Make surethat the Default 
GameModeissetto GM Hlen FPS. Editor 
Startup Map isthe map opened when you 
open theeditor, and it should bethemap you 
want to work on when you open the editor. 
TheGame Default Map hasto bethe map of 
the Start menu, and makesurethat it is set to 
StartMenuLeve (Figure 22.2). 

Step 3: Set up packaging. For the Packaging section, 
all thingscan beleft as default for the Window 
platform. However, the Build Conf guration 
setting under the Project section should be 
set to Shipping when you do your f nal build 
(Figure 22.3). 


4Project - Maps & Modes 


fia These settings are saved in DefaultEngine.ini, which is currently writable. 


4 Default Modes 


Default GameMode 
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4 Default Maps 
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ow € 0 
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4 Project 
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Build Configuration 
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Shipping mode exdudes debugging 
features. Things like Print String or console 
commands arenot going to bein the 
shipping build. 


Step 4: Set uptheWindows platform. Go to the 


Platforms Target 32bit 
Android 4 Splash 

Android Material Quality - ES31 

Android Material Quality - Vulkan 

Android SDK 

Android SM5 Material Quality - Vulkan Editor Splash 

10S 

iOS Material Quality 

Linux 

Lumin Material Quality - Vulkan 

Magic Leap 

Maqic Leap SDK Game Splash 


> Windows 


Plugins 


AVF Media 


GooglePAD 
IMG Media 
Level Sequencer 
Magic Leap Plugin 
MagicLeapARPin Plugin 
Movie Pipeline In Editor 
. Game Icon 
Movie Pipeline New Process 
Movie Render Pipeline 
Niagara 
A change to a source content file has been detected. 
I Would you like to import it? 


f import. Don'timport E PS ESSET What Changed? 
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Platforms section and click on the Windows 
subsection. Inside of the windows section, set 
the Editor Splash, Game Splash, and the Game 
Icon to thef les we supplied in the support f les. 
You can click on the button with “...” after them 
to assign a new f le. When you assign the new 

f les, a notif cation pops at the bottom right 
comer of your screen that asks if you want to 
import it. Clickthe Import button to import then 
(Figure 22.4). 


p 
g A Jm l 
oP NL 17 7 
D^ moo ES ei 2 


The Escaper 


Ver 1.0 


Wis, 


The Escaper 


Ver 1.0 


The Editor Splash is shown when you 
load the editor and the Game Splash is shown 
when you load the game. The game icon is 
theicon of theexecutableof the game. 
Step 5: Build the game. Go to f le Package Project 
— Windows (64-bit). In the pop-up windows, 
f nd afolderto put your game, and make sure 
that thefolder is not in your project folder. Press 
the Select Folder button, and the engine starts 
building thegame (Figure 22.5). 
Thebuilding is going to takea while. Make 
yourself a cup of tea and wait for it to f nish. 
Step 5: Test the game. When the building isf nished, 
a notif cation should show up with an enjoyable 
sci-f -ish sound. Go to thefolder you specify, and 
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open the WindowsNoEditor folder. You should 
seethegamef les built and the executable called 
TheEscaper. Double click TheEscaper to run the 
game (Figure 22.6). 

Now it istimeto enjoy our hard work 
and havesomefun playing the game! More 
importantly, shareit with yourfriends and 
family and see if they like it too! 


Conclusion 


Congratulations on f nishing this book! You should feel 
proud of yourself for this great achievement. Making a 
game is such a time-consuming task, and doing it all by 
yourself requires a tremendous amount of time, patience, 
and dedication. 


However, the joumey is not over, and there is plenty of 
stuf we did not get achance to cover in this book. Unreal 
Engine is a giant game engine that has tons of built-in 
features. Please keep exploring and learning new things 
every day. 


This is also the time you can start to choose your career. 
You can decide to be an indie game developer that does 





everything or you can choose to specialize in one of the 
areas of game development. 


If you want to be an artist, you can try to dip in a variety of 
dif erent software to boost up your productivity. To name 
one, you should def nitely learn ZBrush. It is a must-know 
software if you wish to make the best looking models. 


There are also technical routes you can choose as an 
artist. We did not cover rigging on its full extent, and you 
can move on to study facial expression or rigging any 
other form of creatures. Becoming a rigger can always 
guarantee a decent job because 99% of the students who 
graduated from college don't want to do that. 


On the other hand, you can also study things like 
procedural modeling with Houdini and procedural 
material creation with Substance Designer (a sister 
software of Substance Painter). And even shader 
programming that requires both an eye of an artist and 
the mind of a programmer. 


If you want to get more serious about game 
programming, you should leam C++-or C£ Programming 
can also separate into low-level programming and 
high-level programming. Low-level programming 
creates systems that are robust and extremely ef cient. 
C+t+is, for now, the only answer to that. That is why all 
major game engines and 3D software are built with C++. 
Some programmers may argue that other programming 
languages like CZcan be fast enough, as hardware is 
getting better. That might bethe truth in some situations. 


High-level programming builds game logic based on the 
systems built by low-level programming. At a high level, 
easier languages like CZ Blueprint, and Python are used to 
boost up productivity. 


We want to congratulate you again on f nishing this 
fantastic project. And we hope you can utilize the 
knowledge you have leamed here to create your next 
awesome game! 
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272-215, 276 
eye socket creation, character modeling 275, 
2/6, 276, 277 
eye, UV mapping 330-331, 331 


face 4-5 
facial expression rig 318 
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f Il layer 98, 103 
f Itering assets 235, 236 
f nger controls 427, 428, 428, 429 
f nger joints 402, 402, 403, 404, 404 
f ngers duplication 299, 299 
f rst-person shooter (FPS) animation 
435- 436 
attack animation 453- 455, 454, 455 
camera conf guration 440- 442, 
440- 442, 443 
character rig 436- 437 
cleaning up odd jitters 450 
display layers 437- 440, 438- 439 
ease-in's and ease-out's 451, 453 
export 473- 476, 474, 475 
frame rate 449, 449 
game animations 442, 443 
"Got Caught" animation 456, 457- 460, 
458, 459 
Graph Editor 451- 453, 452 
idle animation 449, 449- 450 
pose creation 443- 444 
reload animation 460- 462, 461 
savef les 437 
two-handed weapon setup 446- 449, 448 
walk animation 455- 456, 456, 457 
weapon movement 444- 446, 445, 447 
f rst-person shooter character creation 
528-539, 528, 529 
AlController 510, 537-539, 537, 538 
Controller 536 
pawn and character 529-536, 530-536 
PlayerController 536-537 
Roll, Yaw, Pitch 536 
FK see forward kinematics (FK) 
FK arm setup 424 
f ipped faces 322 
f oor scratches 100, 101 
foot controller 413 
foot hierarchy setup 412- 413, 413 
foot roll rig 410- 412, 411, 412 
forehead, character modeling 279, 280 
forward kinematics (FK) 446 
4k (4096 x4096) texture 74 
4096 x4096 (4k) textures 95-96 
FPS animation see f rst-person shooter (FPS) 
animation 
FPS Cam viewport 440, 441, 441, 446 
Fragment Shader 2 
frame rate 449, 448 
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Freeze Transformation 30 

Fresnel node 174 

full-body joint skin weighting 418, 420 
functions, UI creation 495-496 


game animations 442 
game engines 128, 134 
GameM ode, UI creation 494- 495, 495, 550 
game programming 478, 791 
garment, UV mapping 334-341, 335- 337, 
339-341 
generators 100, 101- 122, 102, 104- 122 
geometry errors 42- 43 
Get Class Default node 556, 558, 637 
get free assets 236, 237, 238 
Get Player Controller 494, 495 
gizmos 3 
glass materials 125, 126, 126 
gloves 
character modeling 311, 312, 313, 314 
character texturing 376-383, 377-383 
“Got Caught" animation 456, 457- 460, 457, 
458, 460 
Grab and Smooth sculpting 285 
grab tool 303 
Graph Editor 451- 453, 452, 460 
Graphic API 2 
grenade launcher and pipe 462 
grid 44, 44 
Grow Selection 32-33 
Grunge Leak Dirty 99 
gun 
character texturing 385, 386 
joint 431, 432 


hairs 
character modeling 303-306, 303-306 
character texturing 353-355, 353-355 
UV mapping 331-334, 332-334 
hallway, set up a test 157-166, 157-166 
hands, character modeling 296-303, 296-303 
head, character modeling 284-286, 284-286 
head skin weighting 414, 415, 416, 416, 417 
heads-up display (HUD) 494 
health and damage 615-616 
character hit and death 621- 629, 621- 629 
health component creation 616 
actor component 616- 621, 617- 620 
health regeneration 629- 633, 630- 633 
health bar creation 663-672, 665-672 


HealthBarPivot creation 755 
health component creation 586 
actor component 616-621, 617- 620 
health regeneration 629-633, 630- 633 
heel controller 412 
height map, PBR 99, 103, 110 
hero assets 54 
Hide Model 41 
hide the seams, UV mapping 338 
HUD see heads-up display (HUD) 
Hue_ Shift parameter 168, 169 


idle animation 442, 449, 450 
IdleWalk state machine 546 
IK see inverse kinematics (IK) 
IKarm setup 425-427, 425-427 
IK handle 408-409, 410, 426 
image plane setup in Maya 267-268, 268 
index of refraction (IOR) 174 
value 174, 175 
in-game weapon UI creation 649-663, 650 
alignment 654-663, 654-663 
anchors 651, 652- 654, 652- 653 
Canvas Panel 649, 651, 651, 652 
widget switcher 649, 650 
inhale moment, idle animation 449, 451 
instance 39 
Integrated Development Environment (IDE), 
Visual Studio 136 
interior level creation 190-221, 191-221 
assignment 220-221 
internal structures, character modeling 
289, 289 
inventory and UI 635 
health bar creation 663- 672, 665- 672, 673 
in-game weapon UI creation 649-663, 
650 
alignment 654- 663, 654- 663 
anchors 651, 652- 654, 652- 653 
Canvas Panel 649, 651, 651, 652 
widget switcher 649, 650 
pause and game over UI creation 672, 
673-680, 673-680 
assignment 679, 679 
weapon pickup 636-642, 636-642 
weapon switching 642-649, 642, 644-648 
inverse kinematics (IK) 406, 408, 409, 446 
IOR see index of refraction (IOR) 
isMoving variable 546 


joint behavior 392-393, 392 
joint chain creation 
rigging 393-396 
neck 395, 396 
root and spine joints 394, 395 
joint orient 399, 403 
joint placement 393 
left arm 398-404, 398-404 
joint setup 
legs 406- 410, 406-410 
right arm 405, 405 


Lamina faces 43 
landscape level creation 222-224, 222-224 
landscape material creation 226, 227-234, 
228-234, 235 
layers, Substance Painter UI 97 
leather material, character texturing 375, 375 
left armjoint structure 398- 404, 398- 404, 
427,427 
left clavicle skin weighting 418-419, 421 
left foot controller setup 412, 412 
left foot rig setup hierarchy 413, 413 
leftHand_locator 457 
left leg joint structure 407, 408 
legs joint setup 406-410, 406-410 
Lerp node 173 
level creation 
interior level creation 190-221, 191-221 
landscape level creation 222-224, 222-224 
landscape material creation 226, 227-234, 
228-234, 235 
place 3D assets on landscape 234, 235-241, 
236-241 
quixel bridge set up 224-226, 225 
level of details (LODs) 251 
levels, texturing 123-129, 124-129 
light building 165 
light direction 97-98 
lighting 243 
adjust 256-261, 256-261 
lightmap 244, 244 
density 247 
2D 247 
UV 244-245 
volumetric 247, 247 
lightmap resolution 245, 246 
optimize 249-255, 250-255 
Lightmass Importance Volumes 253, 253 
Locatorleftparent 1 457 
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locators 441 

LODs see level of details (LODs) 

lower down baking quality, for quick iteration 
253-255, 254, 255 


manipulation tools, translation 3-4 
Map Size section 71-72 
Mari 61 
marking menu 4, 8, 26 
Mask Editor 101 
material assignments, UV mapping 342 
material distribution, UV mapping 341, 341 
Material Editor 145-146, 146, 170, 228, 491 
material function 228-234, 229-234 
Material Instances 150-157, 151-156 
Maya modeling 
assignments 41, 42, 42 
base f oor creation 44-54, 45-54 
commands 
Center Pivot 40 
Change Pivot 40-41 
Combine and Separate 33-34, 33 
Create Cables or Pipes 34-37, 34-36 
Duplicate, Duplicate with Transform 
38-39, 38-39 
Duplicate Special 39, 40 
Extract Faces 33 
Extrude Along a Curve 37-38, 37-38 
Grow and Shrink Selection 32-33 
Hide Model 41 
mirror 39, 40 
Snapping 41 
View Control 41 
Edge 4 
Face 4-5 
geometry errors 42- 43 
grid 44, 44 
modular set pieces 43 
navigation 1-2, 2 
Normal 5 
Object Mode 5 
rendering 2-3 
rules 
polycount 6 
size and proportion 7 
topology 6, 7 
security camera modelling 7- 32, 8-13, 
15-31 
3D model 3 
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translation 3-4 
user interface 2, 2 
Vertex 4 
Megascan assets 234, 235, 236 
Megascan Ecosystem, Quixel 224 
mesh inspection, character UV mapping 
322- 324, 323, 324 
metal bolts, character texturing 386, 387, 387 
metallic, PBR 98-99 
Metallic Grate Wide 98-99 
Metallic Roughness 92 
middle line problem 324, 324 
mirror 39, 40 
mirroring, skin weighting 419, 420, 421 
mirror joints 405, 405 
mirror plane, position 107 
Mixamo 478 
mobility 248-249 
movable 248 
static 248 
stationary 248-249 
modeling, character 486 
Modeling Toolkit 21, 22 
models arrangement 94, 95 
modular pieces, texturing 93-96 
export models 94 
import to Substance Painter 95 
models arrangement 94, 95 
modular set pieces 43, 52, 53, 53 
motion captured data 476- 479, 477- 480 
motion trail 458, 459, 459, 462 
mouth, character modeling 283, 283, 289, 289 
Move tool 5, 13-14, 15 
Multi-Cut tool 21, 21, 282, 290, 296, 300, 301, 
312, 323 
multiple texturing f les 95 
multiply blending mode 101 


navigation 1-2, 2, 97 
neck, character modeling 287, 288 
neck joint chain 395, 396, 397 
neck skin weighting 416, 416 
N-gon 20, 21, 43 

mesh inspection 322- 324, 323, 324 
non-manifold geometry 42 
normal detailing 109, 110, 111 
normal map, PBR 99, 108, 110, 111, 113 
nose, character modeling 278, 278, 279, 280, 

280-281, 282, 282 





nostrils internals 

character modeling 289, 289 
NOT node 547 
NURBS 34, 35, 36, 410, 438, 439, 447 


Object Mode 5, 31 

one-man-army approach 107 

opacity channel 126-127, 127 

Optimize command, body UV 329, 330 

orange panels 118 

orient constraint 424 

orient UV 64, 64, 65 

origin 2 

outer garment base, character modeling 307, 
308 

outer shell 16, 17 

Outliner 30, 440, 445, 448 

overlapping faces 323, 323 

overshoot pose 458 


packaging 785 
game for windows 786-790, 787-790 
painted approach 116, 116-117 
painting skin weights 414- 419, 415-420 
panel, Substance Painter Ul 97 
pants, character texturing 370-374, 371-374 
parameter 
desaturation 166, 167 
Hue_ Shift parameter 168, 169 
parameters creation for materials 166-188 
actors 177-179, 179 
mobility 180-188, 180-187 
Param node 145 
parenting 31, 32 
Patrolling Al 717-718 
character creation 718-725, 719-724 
controller and behavior tree creation 725, 
725 


blackboard and behavior tree 725-742, 


725-742 
pause and game over UI creation 672- 680, 
673-680 
assignment 679, 680 
pawn and character 529-535, 530-536, 549 
perspective view, image planes 268 
Per Vertex Algorithm 378, 379 
Physically-Based Rendering (PBR) 92 
material channels 98-100, 100 
physics asset 467-468, 467-469 


pipe material 125, 126 
Pistol Walk Skeleton 478 
pivot positioning 45 
pixels 65 
Place Megascan assets 235, 237 
planar projection 63 
player character 527-528 
Actor 549 
animation blueprint 540, 549 
animation graph 541 
animation setting 539-550, 540, 542-548 
character 549 
event graph 540 
f rst-person shooter character creation 
528-539, 528-538 
Game mode 548 
Pawn 549 
Player Controller/Controller/AlController 
548-549 
skeletal mesh 549 
state machine 544-548, 545-548 
vector 541-544, 542-544 
Widget Blueprint 550 
Player Controller/Controller/AlController 
548-549 
Player Index 496 
pod model, UV 74-89, 75- 89 
pole 269 
polycount 6, 27, 267 
reduction methods 27, 28, 29, 29 
polygon 2 356, 356 
Polygon Fill tool 117 
post processing and ef ects, adding 261-262 
assignment 263, 263 
Post Process Volume 262, 263 
Post Process Volume 262, 263 
Prevent Negative Scale setting 25 
preview materials, character modeling 308, 309 
primitive polygons 14 
procedural texturing 102, 356 
programming 487- 488 
Blueprint 489 
C#489 
C++ 488 
Python 489 
proportion, 3D modeling 7 
Python 489 


quad 3, 6 
Quad Draw Tool 272 


Quad Draw Tool (cont.) 
boots pattern and belt 309, 311 
eyebrow 306 
eyelids creation 271, 272 
gun holster 316 
hair 304 
outer garment base 307 


quick iteration, lower down baking quality for 


253-255, 254, 255 
quixel bridge set up 224-226, 225 
QuixelMegascan Ecosystem 224 


refactoring load level mechanic 498, 498-505 


built-in variable types 502-503 
dass 503-505 
custom variable types 503 
variable 499 
variable types 499-501, 500, 501 
referencing character rigs 436- 437 
referencing process 394 
ref ne hand topology 300, 301 
reload animation 460- 462, 461 
Reload Reference 436 
renderer 2 
rendering process 2-3, 6, 20 
resolution, lightmap 245, 246 
retargeting, animation 480- 485, 481- 485 
reticle 441, 443, 442 
re-topologizing tool 272, 273; seealso Quad 
Draw Tool 
retopology 303, 307 
rigging 266, 391, 434 
arm controls set up 422- 423, 422, 423 
clavicle and body controls 429- 431, 
429-431 
constrains 425 
f nal hierarchy 432- 433, 433 
f nger controls 427- 429 
foot hierarchy setup 412-413 
foot roll rig 410- 412, A11, 412 
gun joint 431- 432 
IK arm setup 425-427, 425, 426 
joint behavior 392, 392- 393 
joint chain creation 393-396 
neck 395, 396 
root and spine joints 394, 395 
joint placement 393 
left arm 398- 404, 398- 404 
joint setup 
legs 406- 410, 406- 410 
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right arm 405, 405 
skin weights 413- 414, 414 

copying 420- 422 
mirroring 419- 420, 421 
painting 414-419, 415-420 

right arm joint setup 405, 405 

root and spine joints 394, 395 

root_motion joint 413 

rotate tool 18 

roughness, PBR 99 


scale tool 11, 13, 14, 15, 79 
scattering, subsurface 470-472, 470-472 
sculpting software 93 
sculpting tool 290, 303, 304 
seam artifact 66 
security camera 681- 682 
AlSeer in CH implementation 682-694 
header and sourcef le 687- 694 
Blueprint Version of AlSeer creation 
694- 699, 695- 699 
BP Monitor Class creation 710-715, 
711-715 
creation 699-710, 700-710 
security camera, UV 66, 67, 69, 71, 70 
security camera modeling 8-29, 7-32, 31 
Separate command 34 
Shaded viewing mode 325 
shader 126, 126, 128, 128, 129, 131 
shape 
evolving 315, 315 
Maya model 22-24 
Shift-click trick 368, 381 
Shrink Selection 33 
shooter character creation, f rst-person 528, 
528-539, 529 
size, 3D modeling 7 
skeletal mesh 467- 469, 467-469, 549 
Skeleton 467-469, 467- 469 
Skeleton Tree panel 564 
Skin texturing 345-351, 346-352 
skin weighting 
rigging 414, 414 
copying 420-422 
mirroring 419-420, 420, 421 
painting 414-419, 415-419 
Sliding door class creation 506, 505-524 
casting 524-525 
character 510-520, 511, 513-518, 519-520 
collision 520-524, 521-524 





parent class 506-510, 507-510 
smart material 102 
Snapping 41 
“Snap to Projected Center” 401, 401 
Soften Edge command 10, 10, 13, 14, 275 
Source code 496-498 
sourceimages folder 94 
spacing 453 
Spawn Transform 556 
SphereOverlapActors 587 
Spot Light component 178, 179 
state machine 544-548, 545-548 
Static Lighting Level Scale 254 
StaticMeshActor 177, 179 
status bar, Substance Painter UI 96 
Steel Gun Painted, material 124-125, 126 
Steel Painted Scraped Dirty 103, 104, 105, 112 
straight lines drawing method 106 
straps layer 122-123, 122, 124 
stretching, UV mapping 338 
style sheet 266 
Subdivision Axis 27 
Substance Base Mtl node 169, 169 
Substance Painter 92, 93, 118, 344, 378, 385 

UI 96, 96-97 
subsurface scattering 470-472, 470-472 
super-stretched texture 62 
Surface Translucencyvolume 172 
sweater, character modeling 306, 307, 307, 

308 

symmetry 12, 12 


Target Weld Tool 28 
tessellated NURBS 35, 36 
Tessellation section 35, 43 
texel density 71-74, 74, 80 
for other models 81- 89 
UV mapping 338 
Texture Set List 97 
texturing 91- 92, 131 
Ambient Occlusion 98 
baking 93 
generators 100-122, 101-122 
levels 123-129, 124-129 
light direction 97 
modular pieces 93-94 
export models 94, 95 
import to Substance Painter 95 
models arrangement 94, 95 
navigation 97 


PBR 92 
material channels 98-100, 100 
withphotoshop 338 
rest of models 129-131, 130-131 
result of 129, 130-131 
in Substance Painter 338 
Substance Painter UI 96, 96-97 
texturing software 61 
3D assets on landscape 234-241, 235-241 
3D Cut and Sew UV tool 68, 325 
arms and hands cutting 327 
ear cutting 325 
eyeball UV mapping 330 
hair 331 
sweater cutting 334 
3D model 3 
3D viewport, navigation 97 
thumb and tip topology 296, 296, 297 
Time Slider 444, 449, 449 
timing 453 
toggle symmetry 105, 106 
Toolbox 24 
Tools bar, Substance Painter UI 96 
topology 6, 7, 282, 285, 304 
error 324 
transferer project, create an asset 235 
transform, Maya model 22, 24 
translation 3-4 
triangle pins 493 
tri-planar projection 345 
tube model 37 
tweaked topology 291, 292 
2D viewport, navigation 97 
2D lightmaps 247 
256 x256f oor piece 57, 58 
two-handed weapon setup 446- 449, 447, 448 


UAIPerceptionComponent 685 
UI creation 489-498, 490- 492 
Event Graph 491, 492 
execution pin and order of execution 493, 
493 
functions 495- 496 
GameMode 494, 495 
machine code, source code, and compiling 
496- 498, 498 
Ul of Unreal Editor 137-138, 138 
UI panel 97 
uneven UV distribution 332 
unparenting 32 
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unreal character asset creation 
animation retargeting 480-485, 481-485 
character asset import 464-471, 465- 472 
export FPS animations 473-476, 474, 475 
motion captured data 476-479, 477-480 
Unreal Editor, UI 137-138, 138 
Unreal Engine 4, 134 
grouping in 161 
and Visual Studio up and running 134-139, 
135-138 
navigation 138-139 
UI of Unreal Editor 137-138, 138 
upper body, character texturing 362-370, 
364-370 
upper shell hole 18, 19 
user interface, Maya modeling 2, 2 
Using Substance Painter 189 
UV 
the f oor 63-70, 63-70 
lightmap 244-245 
for other models 81-89 
pod model 74-89, 75-89 
UV Editor 57-58, 58, 59 
UV mapping 57, 319, 321-322, 342 
body UV 324-330, 325-330 
character UV mapping 322 
mesh inspection and cleanup 322-324, 
323, 324 
cutting process 
hide the seams 338 
stretching 338 
texel density 338 
eye UV 330-331, 331 
garment UV 334-341, 335-337, 339-341 
hair UV 331-332, 332-334 
materials arrangement 340, 341, 341 
UV points 59, 60, 60 
UV random color 123 
UV shell 60, 75, 76 
UV tiles 60, 60-61, 61 


vector 541-544, 542-544 

Vertex 4 

VFX addition to game 778-783, 778-783 
View Control 41 

viewport, Substance Painter UI 96 





Viewport 2.0. 3 
visual appearance 266 
Visual Studio 
installation workloads settings 136, 137 
Integrated Development Environment 
(IDE) 136 
Unreal Engine 4 and Visual Studio up and 
running 134-139, 135-138 
navigation 138-139 
UI of Unreal Editor 137-138, 138 
volumetriclightmaps 247, 247 


walk animation 455-456, 456, 457 
wall models 118-119 
watch 
character modeling 312, 314 
character texturing 383-385, 384, 385 
watchband, character modeling 314, 315 
weapon pickup 
inventory and UI 636-642, 636-642 
weapons 551-553 
attackcooldowns, enumeration 582-586, 
582-586 
base weapon class creation 553, 553-582 
animation montage 566-577, 566-577 
comment box 577-582, 578-581 
instigator 557-563, 558-561, 563 
owner 55/7, 558 
persona 563-565, 563, 565 
socket 554-556, 555-557 
character modeling 314-316, 315, 316 
damage 558, 586-613, 586-613 
array 587-588 
loop 588-613, 589- 613 
movement 444-446, 445, 447 
weapon switching, inventory and UI 642-649, 
642, 644-648 
Widget Blueprint 550 
widget switcher, in-game weapon UI creation 
649, 650 
workf ow, character modeling 267 
world joint 396, 397 
World Settings panel 138 


ZBrush 61, 93, 267, 273, 304, 319 
zero length edge 43 


